@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@300;400;500;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@300;400;500;700;800;900&family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');

.f_mpl{font-family: 'M PLUS 1p', sans-serif;}
.f_not{font-family: 'Noto Sans JP', sans-serif;font-weight: 700;}

body{cursor: none;}

.index_header .nav_box { background-color: #efefef;}
#global-nav a span{color: #18202c!important;}

#fakeloader{
background-color: #fff!important;
background: rgba(0, 166, 234, 1);
background: -webkit-linear-gradient(135deg, rgba(0, 166, 234, 1), rgba(234, 236, 198, 1));
background: linear-gradient(135deg, rgba(0, 166, 234, 1), rgba(234, 236, 198, 1));
}

.nav_box:not(.nav_box_top ){
background-color: #fff!important;
background: rgba(43, 192, 228, 0.4);
background: -webkit-linear-gradient(to right, rgba(43, 192, 228, 0.4), rgba(234, 236, 198, 0.4));
background: linear-gradient(to right, rgba(43, 192, 228, 0.4), rgba(234, 236, 198, 0.4));
}

#main_img::after,
#contents figure::after,
#contents2 .contents_img::after{
content:'';
position: absolute;
top: 0%;
left: 0%;
width:100%;
height:100%;
background: rgba(43, 192, 228, 0.2);
background: -webkit-linear-gradient(to right, rgba(43, 192, 228, 0.2), rgba(234, 236, 198, 0.3));
background: linear-gradient(to right, rgba(43, 192, 228, 0.2), rgba(234, 236, 198, 0.3));
z-index:1;
}

#page8 button {
    cursor: pointer;
    border: 1px solid #18202c;
}

/* cms */
#cms_2-c .cate_list{display:none;}
#cms_2-c .box_description2 {background-color: #f4f4f4;}

#cms_6-c_ex .cate_box {background-color: #f4f4f4;}

#cms_5-c .box_title1::before {top: 2px;}
#cms_5-c .box_txt1::before {top: 3px;left: 15px;}

@media screen and (min-width:769px){
.fat-nav.active li a .after{transform: scale(0, 1);}
}

@media screen and (max-width: 768px){
#global-nav ul li a .after, .fat-nav.active li a .after {transform: scale(0, 1);}
#cms_5-c .box_txt1::before {left: 15px;}
}

@media screen and (max-width: 667px){
.hamburger {height: 42px;}
.nav_box_top{
background-color: #fff!important;
background: rgba(43, 192, 228, 0.4);
background: -webkit-linear-gradient(to right, rgba(43, 192, 228, 0.4), rgba(234, 236, 198, 0.4));
background: linear-gradient(to right, rgba(43, 192, 228, 0.4), rgba(234, 236, 198, 0.4));
}
#cms_5-c .box_txt1::before {left: 2px;}
}

@media all and (-ms-high-contrast:none){

}

/* color */
.txt_color_nomal,.hvr_txt_color_nomal:hover,.linkStyle{color: #333333;}
.txt_white,.hvr_txt_white:hover,.txt_white .linkStyle{color: white;}
.txt_red,.hvr_txt_red:hover,.txt_red .linkStyle{color: red;}
.txt_color1,.hvr_txt_color1:hover,.txt_color1 .linkStyle{color: #18202c;}
.txt_color2,.hvr_txt_color2:hover,.txt_color2 .linkStyle{color: #bbe0f0;}
.txt_color3,.hvr_txt_color3:hover,.txt_color3 .linkStyle{color: #90c31f;}
.txt_color4,.hvr_txt_color4:hover,.txt_color4 .linkStyle{color: #ECECEC;}
.txt_color5,.hvr_txt_color5:hover,.txt_color5 .linkStyle{color: #0ba1de;}

/* background-color */
.bg_white,.hvr_bg_white:hover{background-color: white;}
.bg_black,.hvr_bg_black:hover{background-color: black;}
.bg_color1,.hvr_bg_color1:hover{background-color: #18202c;}
.bg_color2,.hvr_bg_color2:hover{background-color: #bbe0f0;}
.bg_color3,.hvr_bg_color3:hover{background-color: #0ba1de;}
.bg_color4,.hvr_bg_color4:hover{background-color: #ECECEC;}
.bg_color_clear,.hvr_bg_color_clear:hover{background-color: transparent!important;}

/* border-color ※!important */
.border_color1,.hvr_border_color1:hover{border-color: #0ba1de;}
.border_color2,.hvr_border_color2:hover{border-color: #bbe0f0;}
.border_color3,.hvr_border_color3:hover{border-color: #90c31f;}
.border_color4,.hvr_border_color4:hover{border-color: #ECECEC;}

/* CURSOR */
.cursor,.follower{
	border-radius: 50%;
	position: fixed;
	top: 0;
	left: 0;
	pointer-events: none;
}
.cursor{
	background-color: #0ba1de;
	width: 8px;
	height: 8px;
	z-index: 100001;
}
.follower{
	background-color: #bbe0f0;
	width: 40px;
	height: 40px;
	z-index: 100000;
	transition: 0.3s;
	opacity: 0.7;
	transition-property: transform,background;
}
.follower.is-active{
	background-color: transparent;
	border: solid 1px #0ba1de;
	transform: scale(1.5);
}
.cursor.is-active.more_move,.cursor.is-active.more_info{
	background-color: transparent;
}