/*===========================================================*/
/* 個別 */
/*===========================================================*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Noto+Sans+JP:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@200&family=Oswald&family=Potta+One&family=Zen+Maru+Gothic:wght@400;500&display=swap');
body{
        font-family: "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
        font-weight: 500;
}
header.scr_header {
    background-color: rgb(115 115 115 / 85%);
}
#pc_nav li a, #footer_nav li a,.cms_title h3{text-transform: uppercase;}
#loading{background-color: #fff;}
/*.txt_color_nomal, .hvr_txt_color_nomal:hover,#top_cms .cms_title ,.cms_title p{
    color: #ffffff;
}*/
/*img{    filter: grayscale(100%) contrast(100%);}*/
.cms_title h3,#contents_wrap .more,.top_cms_box .more,#loading #loading_text .progressbar-text ,#pc_nav li a, #footer_nav li a,.overlay .overlay-nav .top .jp,.overlay-nav .middle .jp:first-of-type,.overlay .overlay-nav .bottom .en,#page10 li,#page_title .jp,.modal_bt{font-family: "Oswald", sans-serif!important;}
.linkStyle{color: #333;border-bottom: 1px solid;}
#logo{opacity: 0.8;}
header.scr_header #logo{opacity: 1;}
#logo img{max-width: 200px;}
#pc_nav li a{display: none;}
header.scr_header {
    background-color: rgb(255 255 255 / 85%)!important;
}
.menu-trigger-bar{background-color: #121212;}
#contents .num{display: none;}
#intro .intro_photo h2,.top_title h2{display: none;}
/*main.blur {
    background: rgb(0 0 0 / 95%);
}*/
.intro_title1,.con_title,.cms_title p{font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";}
.intro_txt {line-height: 3;}
.dec01{
    transform: translateZ(0);
  animation: round 1.5s infinite ease;
  left: 0;
    top: 0;
    z-index: -1;
    max-width: 300px;
}
@keyframes round {
  0% {
    transform: rotate(20deg);
  }
  100% {
    transform: rotate(380deg);
  }
}
.modal-open span{
    background-color: transparent;
    color: #000;
        
}
.modal-open .more_item{border: 1px solid;}
.more_item::before{content: none;}
.more_item .text{padding-left: 0;}
.modal-open .more_item:hover{background-color: transparent;}
.more_item::after {
    content: "";
    background: url(dup/img/btn_bg.png) no-repeat right;
    background-size: cover;
    width: 45%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
    opacity: 0.6;
    transition: 0.4s;
}
.more_item:hover::after{width: 100%;opacity: 1;}
.txt01{
    right: 0;
    top: -10vw;
    z-index: -1;
        max-width: 1290px;
    width: 90%;
}
.fix_banner{max-width: 250px;width: 22%;}
.fix_banner a,.fix_banner a:hover{background-color: transparent;border: none;}
.fix_banner .more_item:hover::after,.fix_banner .more_item::after{content: none;}
.fix_banner a::before {
    content: "";
    background: url(dup/img/dec01.png) no-repeat center;
    background-size: 90%;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    animation: round 1.5s infinite ease;
}
#contents_wrap{position: relative;padding: 10% 0 10%;}
#contents_wrap::before,#intro_wrap::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(dup/img/bg01.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    z-index: -1;
}
#top_cms .cms_title .bar{display: none;}
#intro_wrap{display: block;padding-top: 50%;}
#intro .intro_right{width: 100%;}
.con_box .con_img,.con_box3 .con_img{border-radius: 100px 0 0 100px;}
.con_box.box2 .con_img{border-radius: 0 100px 100px 0;}

.modal_title1{display: none;}

.img01,.img02,.img03,.img04{max-width: 680px;
    width: 33%;}
.img01{
        top: 20%;
    left: 0;
}
.img02{
        top: 17%;
    left: 20%;
}
.img03{
        top: 10%;
    right: 20%;
}
.img04{
        top: 20%;
    right: 0;
}
#contents .con_title {
    font-size: 3vw;
}
.con_box .con_title span{
        background: -webkit-linear-gradient(0deg, #4cb8c4, #3a67a3, #6b5b95, #e84545);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.con_box.box2 .con_title span{
     background: linear-gradient(45deg, #00bcd4, #03a9f4, #2196f3, #3f51b5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.con_box.box3 .con_title span{
     background: linear-gradient(90deg, #ffd700, #ff7f50, #87ceeb, #98fb98);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
#main_img:before{background-color: transparent;}
#top_cms .more_item{
    background-color: transparent;
    color: #28282d;
    border: 1px solid;
}
#top_cms .top_cms_box{
    border: none;
    padding: 5% 0;
}
.cms_title h3{font-size: 80px;}
#loading #loading_text .progressbar-text,#main_img .scroll, #page_title_img .scroll{display: none;}
.cate_list:before {
    background-color: rgb(0 0 0)!important;
}
.top_title_color{opacity: 0;}
.intro_title1 span{
    background: linear-gradient(45deg, #ff75a0, #87a7d9, #78ffd6);
    color: #fff;
    padding: 5px 20px;
}
footer #footer_info {
    background-color: #b3b3b3;
}
/*--------------------------------------------
 モーダル 
----------------------------------------------*/
.modal_bt{
    cursor: pointer;

    margin-top: 30px;
    margin-bottom: 20px;
    border: 1px solid;
    color: var(--text);

}


.modal_box{
    top: 0;
    left: 0;
    background-color: rgba(245,255,255,0.9);
    z-index: 101;
    overflow-y: scroll;
}
.modal_box .close{
    top: -15px;
    right: -15px;
    width: 50px;
    height: 50px;
    cursor: pointer;
}
.modal_box .modal-close{
	cursor: pointer;
	position: absolute;
    top: 0;
    right: 0;
}
.modal_box .modal-close span{
	display: block;
	width: 50px;/*枠の大きさ*/
	height: 50px;/*枠の大きさ*/
	position: relative;
}

.modal_box .modal-close span::before, .modal_box .modal-close span::after{
	content: "";
	display: block;
	width: 100%;/*バツ線の長さ*/
	height: 2px;/*バツ線の太さ*/
	background: #000;
	transform: rotate(45deg);
	transform-origin:0% 50%;
	position: absolute;
	top: calc(14% - 1px);
	left: 14%;
}

.modal_box .modal-close span::after{
	transform: rotate(-45deg);
	transform-origin:100% 50%;
	left: auto;
	right: 14%;
}
.modal-open span{cursor: pointer;}

/* タブレット */
@media screen and (max-width: 768px){
    .modal_bt{
        margin: 20px auto;
    }
    .modal_wrap .modal_item{
        padding-top: 130px;
    }
}

/* スマホ */
@media screen and (max-width: 667px){
    .modal_bt{}
    .modal_wrap .modal_item{
        padding-top: 0;
    }
}

/*2024/09/18*/
.catch{z-index: 2;}
/*===========================================================*/
/* コード集 */
/*===========================================================*/




/*===========================================================*/
/* 下層 */
/*===========================================================*/
#cms_2-g .cate_img1 {
    max-height: inherit;
}
#page_title .en{    font-family: "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;}
#page_title .jp{font-size: 120px;top: -50px;}
#page_title .en{display: none;}
#page_title .jp:before{top: 0;}
#page_title{height: 100px;}
#page_title_img:before{background-color: transparent;}
.pager li a:hover {
    background-color: rgb(115 115 115 / 70%)!important;
}
/*===========================================================*/
/* タブレット */
/*===========================================================*/
@media screen and (max-width: 768px){
.fix_banner {
    max-width: 200px;
    width: 30%;
}
#contents .con_title {
    font-size: 5vw;
}
.con_box .con_img, .con_box3 .con_img {
    border-radius: 230px 0 0 230px;
}
.con_box.box2 .con_img {
    border-radius: 0 230px 230px 0;
}
#intro_wrap {
    padding-top: 60%;
}
#page_title{height: inherit;}
#page_title .jp:before{height: 120px;}
#page_title .jp {
    font-size: 80px;
}
#logo img {
     max-width: 200px; 
}


}



/*===========================================================*/
/* スマホ */
/*===========================================================*/
@media screen and (max-width: 667px){

.fix_banner a::before{background-size: 80%;}
.fix_banner {
    max-width: 200px;
    width: 37%;
    right: 0;
}
#copyright{font-size: 12px;}
.intro_txt{font-size: 14px;}
.intro_txt span{text-align:left;}
#intro_wrap {
    padding-top: 100%;
}
.img01, .img02, .img03, .img04 {
    max-width: 680px;
    width: 60%;
}
.img01 {
    top: 3%;
    left: -20px;
}
.img02 {
    top: 18%;
    left: -5%;
}
.img03 {
    top: 3%;
    right: 0%;
}
.img04 {
    top: 17%;
    right: -20px;
}
.cms_title h3 {
    font-size: 50px;
}
#page_title .jp {
    font-size: 40px;
    top: 0;
}
#page_title .jp:before {
    height: 60px;
}
#logo img {
    max-width: 150px;
}
/*2024/09/18*/
#logo img {
        max-width: 100px;
    }

}
/*2024/10/07*/
#intro .img01{
        max-width: 550px;
    height: auto;
    transform: rotate(-10deg);
}
#intro .img02{
    max-width: 550px;
    height: auto;
    transform: rotate(10deg);
    left: 25%;
}
#intro .img03{
        max-width: 550px;
    height: auto;
    transform: rotate(5deg);
    right: 24%;
}
#intro .img04{
    max-width: 550px;
    height: auto;
    transform: rotate(-10deg);
}
/* スマホ */

@media screen and (max-width: 667px){
    #intro .img01{
        max-width: 200px;
        top: 3%;
    left: -20px;
}
#intro .img02{
    max-width: 200px;
     top: 18%;
    left: -5%;
}
#intro .img03{
        max-width: 200px;
        top: 3%;
    right: 0%;
}
#intro .img04{
    max-width: 200px;
    top: 17%;
    right: -20px;
}
}


/*===========================================================*/
/* IE */
/*===========================================================*/
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none){



}


/*===========================================================*/
/* Firefox */
/*===========================================================*/
@-moz-document url-prefix(){

}