@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');
body{
font-family: 'Noto Sans JP',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important ;
}
body,h1,h2,h3,h4{font-weight: 600;}
svg{fill: none;}
.linkStyle{color: #8dc3e5;}
.more{margin: 30px auto 0;}
#main_img{height: 55vw;}
.catch{
width: 100%;
    height: 100%;
    bottom: -108%;
    right: -95%;
    background: url(Dup/img/catch.png)no-repeat;
    transform: translate(-50%,-50%);
    z-index: 2;
    background-size: 50%;
}
#wrap{
    opacity: 0;
}
#fakeloader{
	z-index: 9999;
	animation: fadeout 3s ease forwards;
        background-color: #8dc3e5;
}
#fakeloader .fl{
	position: absolute!important;
	top: 50%!important;
	left: 50%!important;
	transform: translate(-50%,-50%)!important;
	width: 100%!important;
	max-width: 400px;
	animation-name: loader;
	animation-duration: 3s;
	animation-timing-function: ease;
}
@keyframes fadeout{
	50% {opacity: 1;}
	98%,100% {opacity: 0;}
}
@keyframes loader{
	0% {opacity: 0;}
	50% {opacity: 1;}
	100% {opacity: 0;}
}
.point{
    display: block;
    max-width: 200px;
    margin: auto;
    margin-left: 0;
    margin-bottom: 5px;
}
.welcome{
    display: block;
    max-width: 200px;
    margin: auto;
    margin-bottom: 5px;
}
#intro_txt h2:before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    bottom: 0;
    background: url(Dup/img/welcome.png)no-repeat;
    background-size: contain;
    z-index: 1;
    width: 300px;
    height: 100%;
    transform: translate(-50%,-50%);
}
#contents:before {
content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 180px;
    background: url(Dup/img/strong.png)no-repeat;
    background-size: contain;
    z-index: 1;
    width: 450px;
    height: 100px;
    transform: translate(-50%,-50%);
}
#contents,#intro_txt{
    padding-top: 10%;
    

}

.cms_5-b .cate_box .open_bt .box_title1::before {
    color: #0065A6!important;
}
#contents .box .grid_6{
    background: url(Dup/img/bg_point1.png)no-repeat center;
    background-size: 300px;

}
#contents .box .point2{
    background-image: url(Dup/img/bg_point2.png);

}
#contents .box .point3{
    background-image: url(Dup/img/bg_point3.png);

}
.fadein{
     opacity: 0;
     transform: translateY(20px);
     transition: 1.5s;
     transition-property: opacity,transform
}
.fadein.fadetrans{
     opacity: 1;
     transform: none
}
.point_delay.fadein{transition-delay: 0.2s;}
.fadein2{position: relative}
.fadein2 .fadein2_filter{
     top: 0;
     right: 0;
     transition: 0.6s;
     transition-property: width;
     background-color: #0065a6;
}
.fadein2 .fadein2_filter.fadetrans{
     width: 0!important
}
header #header #header_menu li a span{color: #333;}
header #header #header_menu li a span:hover{color: #0065A6;}
#info .info_txt  h3,#info .info_txt p{color: #333;}
#intro_txt span{border-color: #0065a6;}
.more .hvr_border_color3:hover{border-color: transparent;}
#intro_txt{background-color: rgba(255,255,255,0.8);}
#intro{padding-bottom: 0;}
#contents{background-position: top 120px left 50%;}
.point2 .point{margin-left: 8.33333%;}
header{background-color: rgba(255,255,255,0.9);}
#footer li img{height: 87%!important;}
/*--------------------------------
下層
-------------------------------*/
#cms_5-b .cate_box .open_bt .box_title1::before{color: #0065a6!important;}



/*-----------------------------------
tabret
---------------------------------*/
@media screen and (max-width: 768px){
#page_title{background-position: center;}
#intro_txt h2:before{
    bottom: 20px;
    width: 260px;
}
#contents:before{    top: 120px;}
#intro_sp{height: 0;}
#intro #intro_txt{    padding-top: 110px;}



}





/*-----------------------------------
sp
---------------------------------*/
@media screen and (max-width: 667px){
#intro_txt h2:before{
bottom: -20px;
width: 200px;
}
#contents:before{
top: 100px;
    width: 330px;
}
.drawer-hamburger-icon,.drawer-hamburger-icon::after, .drawer-hamburger-icon::before{background-color: #333333!important;}
.drawer-open .drawer-hamburger-icon {
    background-color: transparent!important;
}
#fakeloader .fl{max-width: 200px;}
.point2 .point{margin-left: 0;}
#main_img{margin-top: 70px;}


}



/*-----------------------------------
IE
---------------------------------*/
@media screen and (-ms-high-contrast:none){
.more a{padding-top: 5px;}
#cms_2-a .cate .cate_title{padding-top: 10px!important;}
#cms_6-b .cate .cate_title{padding: 10px 5px 10px!important;}
#page_title h2 span{padding-top: 20px!important;}

}