/*linkStyle*/
a.linkStyle {
    color: #0877c7 !important;
    transition: 0.5s;}
a.linkStyle:hover {
    opacity: 0.7;}
/*linkStyle*/

/*毎回いる*/

.swiper-button-next, .swiper-button-prev { z-index: 2 !important;}
#top_cms.back1:before {z-index: -1;}
.nav_menu_more a span::before {
    display: none !important;}
.nav_menu_more.mg_t-10px a span::before {
    display: block !important;}
div#contents2_wrap {margin-top: 50px;}


@media screen and (max-width: 667px){
#contents1 .line:before, #contents2 .line:before {
    left: 50%;
    -ms-transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    transform: translate(-50%,0);}
}

/*video---------------------------------------------------------------------------*/
.video_wrap {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100vh;
}
video {
	min-width: 100%;
	min-height: 100vh;
	z-index: 1;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}




#main_img::before {height: 100vh;}
#page_title .title_img {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 500px;}
.title_img:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(175,175,175,0.6);
    position: absolute;
    top: 0px;
    left: 0;}
#page_title:before {height: 0%;}


/*IE*/
@media all and (-ms-high-contrast: none){
    .video{width: 100%;}
    .pager li a {padding-bottom: 9px !important;}
    .cate_list li a {padding-bottom: 12px !important;}
.cate_list li a::before { top: 52% !important;}
#cms_6-a .cate .cate_title { padding-top: 5px !important;}
#cms_3-b .cate_title {padding-top: 7px !important;}
#cms_2-a .cate .cate_title { padding-top: 7px !important;}

#contact_tel a{padding-top: 24px !important;}
#page_title .page_title_box { padding-bottom: 25px !important;}

#page9 .more {
    padding-bottom: 5px !important;
    padding-top: 0px !important;}

#page10 .more_btn { padding-top: 9px !important;}


}
/*タブレット*/
@media screen and (max-width: 768px){
#main_img:before {height: 50vh;}
#main_img .menu {display: none;}
.page_title_box {width: 45%;}
}
/*スマホ*/
@media screen and (max-width: 667px){
div#video {height: 45vh;}
#main_img:before {height: 45vh ;}
video.video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);}
#page_title .title_img {height: 300px;}
#page_title .page_title_box {padding: 20px 10px 30px;}
.page_title_box {width: 73%;}
}
/*video---------------------------------------------------------------------------*/

/*header-------------------------------------------------------------------------*/
header.scr_header #logo {max-width: 90px;}
.top header{z-index:3 !important;}
.opacity_0{opacity:1 !important;}
.menu { display: none;}
/*header-------------------------------------------------------------------------*/



/*color------------------------------------------------------*/
/*#cffaff 207,250,255*/

/*text*/
.txt_color1 {color: #7b848a;}
.txt_color3 {color: #0877c7;}
h3 {color: #0877c7;}
.num{color:#087bc7;}

div#footer_con h2 {color: #0877c7;}
header li a.txt_white {color: #0877c7;}

#info_contact p span{color:#0877c7;}
/*text*/

/*bg*/
.bg_color1 {background-color: #0877c7;}
.bg_color2 {background-color: #cffaff;}
.bg_color3 {background-color: #0877c7;}

.button_container span { background: rgba(8, 119, 199,1);}

div#fakeloader {
    background-image: url(dup/img/bg_img.jpg) !important;
    background-size: cover;
}
/*bg*/

/*border*/
.border_color1 { border-color: #0877c7;}
.border_color2 { border-color: #b0eaff;}
.border_color3 {border-color: #b0eaff;}
.border_color4 { border-color: #b0eaff;}
/*border*/

/*beforeafter*/
.back1:before,.back2:before{ background-color: rgba(207,250,255,0.1) !important;
                             background-image: url(dup/img/bg_img.jpg) !important;
                             background-attachment: fixed;
                             background-size: cover;}
.more_btn:hover:after {background-color: rgba(18,123,199,0.1) !important;}
.line:before {background-color: rgba(8,123,199,0.5) !important;}
.more_btn:before {border-color: rgba(18,123,199,0.7) !important;}
.line-l:before {background-color: rgba(123, 132, 138,0.5) !important;}
#main_img:before,#contents3_wrap:after,#info_contact .con_img:before,.title_img:before{background-color:rgba(235,254,255,0.6) !important;;}
#main_img:before{z-index:2;}
#pc_nav li a::after, #top_pc_nav li a::after{background: rgba(8, 119, 199,0.5);}

header.scr_header{background-color: rgba(227,252,255,0.6) !important}

.overlay {background: linear-gradient(135deg, rgba(50, 141, 207,0.9) , rgba(8,119,199,0.9) ) !important;}
/*color------------------------------------------------------*/


/*font-------------------------------------------------------------------------*/
body {font-family: 'Noto Serif JP',"游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif" !important;}
.cms_title p,.page_title_box p,.con_title .pop400,.con_box h2,a.more_btn,.pop400{font-family: 'Kurale','Kaisei Decol',"游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif" !important;}
a,.box_title1,.cate_title,.box_title2,.hannari{
    font-family:'Kurale','Kaisei Decol',"游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif" !important;}
    
.font_14 {font-size: 17px;}
.opacity08,.opacity07 { opacity: 0.9;}
.page_title_box p { font-size: 19px;}
div#pc_nav a {font-size: 20px;}
.font_16 {font-size: 18px;}

#pc_nav li{ max-width: 170px;}
.line-l:before {top: 16px;}
/*font-------------------------------------------------------------------------*/


/*logo-------------------------------------------------------------------------*/
h1#logo {
    background: #FFF;
    padding: 10px;
    max-width: 350px;
    border-radius: 10px;}
    
header.scr_header #logo {
    max-width: 250px;}
    
p#logo2 img {
    background: #fff;
    padding: 10px;
    border-radius: 10px;}
    
p#logo2 a { max-width: 350px;}


#fakeloader .fl {
    max-width: 400px;
width: 100% !important;
}
/*logo-------------------------------------------------------------------------*/

/*catch-------------------------------------------------------------------------*/
.catchcopy {
    z-index: 2;
    max-width: 700px;
    width: 100%;
    /*bottom: 36%;*/
    /*left: 7%;*/
    
}
/*catch-------------------------------------------------------------------------*/


/*IE*/
@media all and (-ms-high-contrast: none){
.more_btn{ padding-top: 7px !important;}
    

}
/*タブレット*/
@media screen and (max-width: 768px){

/*logo*/
h1#logo {max-width: 280px;}
header.scr_header #logo { max-width: 270px;}
/*logo*/



.button_container {top: 60%;}

div#footer_con h2 { font-size: 20px;}

.font_20_tb {font-size: 23px;}
.font_30_tb { font-size: 28px;}

#contents2 .con_box { margin-top: 0%;}
#contents2 .con_img, #contents1 .con_img { margin-bottom: 2%;}
#contents1 .num, #contents2 .num {
    font-size: 50px;
    left: 50% !important;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);}

.catchcopy {
    z-index: 2;
    max-width: 450px;
    width: 100%;
    bottom: -17%;
    /*left: 4%;*/
    /*top: 16%;*/
}

video {min-height: 50vh;}

#cms_1-a .pager li {margin-right: 0px;}

}


/*スマホ*/
@media screen and (max-width: 667px){
h1#logo {max-width: 180px;}

.catchcopy {
    z-index: 2;
    max-width: 300px;
    width: 100%;
    bottom: -24%;
}

.font_30_tb { font-size: 24px;}
.font_14 { font-size: 15px;}
.font_20_tb { font-size: 22px;}


#contents1 .line:before, #contents2 .line:before {
    left: 50%;
    -ms-transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    transform: translate(-50%,0);}
    
#contents1 .num, #contents2 .num {top: 0px;}
section#intro {margin-bottom: 150px;}

p#logo2 a {
    max-width: 300px;
    padding: 10px;
    background: #fff;
    border-radius: 10px;}

p#logo2 img{ padding: 0px;}

div#footer_con h2 { font-size: 18px;}

.logo_sp{
    /*background: transparent !important;*/
    max-width: 60px !important;
}
.logo_sp {
    padding: 5px !important;
}
header.scr_header #logo .logo_sp{
    max-width: 60px !important;
}

#fakeloader .fl {
    max-width: 300px;
width: 100% !important;
}

#contact_tel a{padding:15px;}

.page_title_box {width: 75%;}

video { min-height: 45vh;}

#contact_tel a, #contact_mail a {
    padding: 15px 10px;
    font-size: 20px;}
    
/*beforeafter*/
.back1:before,.back2:before{ background-color: rgba(207,250,255,0.1) !important;
                             background-image: url(dup/img/bg_img.jpg) !important;
                             background-attachment: scroll;
                             background-size: cover;}
}