﻿/*毎回いる*/

.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---------------------------------------------------------------------------*/
#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%;}
}
/*タブレット*/
@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: 220px;}
.top header{z-index:3 !important;}
.opacity_0{opacity:1 !important;}
.menu { display: none;}


/* header 表記--------------------------------------------------------------------------*/
#pc_nav ul li a span.jp {
    display: inline !important;
    transition: 0.5s;
}
#pc_nav ul li a:hover span.jp {
    display: none !important;
    transition: 0.5s;
}
#pc_nav ul li a span.en {
    display: none !important;
    transition: 0.5s;
}
#pc_nav ul li a:hover span.en {
    display: inline !important;
    transition: 0.5s;
}

#pc_nav li a{width: 140px !important;
    text-align: center !important;}
#pc_nav li{margin-right:0px !important;
            max-width: 140px !important;}
            
#pc_nav li a:hover::after, #top_pc_nav li a:hover::after{transform: scale(0);}
/*header-------------------------------------------------------------------------*/

/* YouTube --------------------------------------------------------------------------*/
.yt{width: 800px;}
.video_cms{
	padding-bottom: 57%;
	height: 0;
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 667px){
/* YouTube */
.yt{width: 100%;}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
/* YouTube */
.video_cms {padding-bottom: 56.25%;}
}


iframe {display: block !important;}
/* YouTube --------------------------------------------------------------------------*/


/*font-------------------------------------------------------------------------*/
body{font-family:'Zen Kaku Gothic Antique',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
font-weight:500;
}
.hannari,.pop400,.pop300 {
    font-family: 'Zen Maru Gothic',"Hannari","游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif" !important;
    font-weight:500;
}
/*font-------------------------------------------------------------------------*/

/* color ------------------------------------------------------------------------------------*/
body,.txt_color_nomal{color: #4d321d;}
.txt_color1{color: #ffa500} /* メインカラー */
.txt_color2{color: #ffb500} /* サブカラー */
.txt_color3{color: #ff9f4a} /* アクセントカラー1 */
.txt_color4{color: #FFF7F0} /* アクセントカラー2 */
/* background-color */
.bg_color1{background-color: #ffa500} /* メインカラー */
.bg_color2{background-color: #ffb500} /* サブカラー */
.bg_color3{background-color: #ff9f4a} /* アクセントカラー1 */
.bg_color4{background-color: #FFF7F0} /* アクセントカラー2 */
/* border-color ※!important */
.border_color1{border-color: #ffa500}
.border_color2{border-color: #ffb500}
.border_color3{border-color: #ff9f4a}
.border_color4{border-color: #FFF7F0}
/* hover ---------*/
/* color */
.hvr_txt_color_nomal:hover{color: #4d321d;}
.hvr_txt_color1:hover{color: #ffa500} /* メインカラー */
.hvr_txt_color2:hover{color: #ffb500} /* サブカラー */
.hvr_txt_color3:hover{color: #ff9f4a} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #FFF7F0} /* アクセントカラー2 */
/* background-color */
.hvr_bg_color1:hover{background-color: #ffa500} /* メインカラー */
.hvr_bg_color2:hover{background-color: #96531b} /* サブカラー */
.hvr_bg_color3:hover{background-color: #ff9f4a} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #FFF7F0} /* アクセントカラー2 */
/* border-color ※!important */
.hvr_border_color1:hover{border-color: #ffa500 !important}
.hvr_border_color2:hover{border-color: #ffb500 !important}
.hvr_border_color3:hover{border-color: #ff9f4a !important }
.hvr_border_color4:hover{border-color: #FFF7F0 !important}

header{background-color: rgba(255,165,0,0.5) !important;}
header.scr_header {background-color: rgba(255,165,0,0.9) !important;}
#info_contact .con_img:before {background-color:rgba(201, 135, 14,0.3) !important;}
#footer { background-color: rgba(255,255,255,0.2) !important;}
div#footer h2, div#footer p, div#footer a { color: #fff !important;}
.title_img:before {background-color: rgba(252, 220, 164,0.7) !important;}
.nav_menu_more a {background: #b06323;}
/* color ------------------------------------------------------------------------------------*/

#logo {max-width: 230px !important;}
header.scr_header #logo { max-width: 180px !important;}
p#logo2 a {max-width: 200px;}
#fakeloader:before{background:rgba(255,255,255,0) !important;}
.button_container { top: 60% !important;}
.return a {color: #4d321d;}
.overlay {
    background: linear-gradient(135deg, rgba(255,165,0,0.9) , rgba(255,159,74,0.9) ) !important;}
#footer_nav li a::after {background: rgba(77, 50, 29,0.3) !important;}
.cate_list li a {
    background-color: rgba(255, 165, 0,0.9) !important;
    color: #fff !important;}
.cate_list li a:hover { background-color: rgba(255, 165, 0,0.6) !important;}

/*linkStyle*/
a.linkStyle {
    color: #ffa500;
    border-bottom:solid 1px !important;
    transition: 0.5s;
}
a.linkStyle:hover {
    color:#ffa500;
     border-bottom:solid 1px !important;
}

/*top-------------------------------------------------------------------------*/
#main_img:before {background-color: rgba(70,70,70,0.0) !important;}
.back1:before, .back2:before {
    background-image: url(Dup/img/bg_img.jpg) !important;
    background-size: 70%;
}
.catch {
    z-index: 2;
    max-width: 650px;
    left: 30%;
    top: 35%;}

.banner{width:65%;
    margin-top:80px;
    padding-top:150px;
    padding-bottom:80px;

}
@media screen and (max-width: 1600px){
.banner{width:70%;}}
@media screen and (max-width: 1400px){
.banner{width:90%;}}

#intro .num {
    background: url(dup/img/01.png);
    font-size: 0;
    position: absolute;
    width: 126px;
    height: 99px;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 1.0;
    top: -47px;
    left: 50%;}

#contents1 .num {
    background: url(dup/img/02.png);
    font-size: 0;
    position: absolute;
    width: 126px;
    height: 99px;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 1.0;}
    
#contents2 .num {
    background: url(dup/img/03.png);
    font-size: 0;
    position: absolute;
    width: 126px;
    height: 99px;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 1.0;}

#contents3 .num {
    background: url(dup/img/04.png);
    font-size: 0;
    position: absolute;
    width: 126px;
    height: 99px;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 1.0;
    top: -50px;}
/*top-------------------------------------------------------------------------*/


.pager li a {background-color: rgba(255,159,74,0.8) !important;}


#cms_5-c .box_title1::before {
    content: "" !important;
    background-image: url(dup/img/Q.png) !important;
    background-repeat: no-repeat;
    background-size: contain;
    width: 50px;
    height: 45px;
    position: absolute;
    top: 8px;
    left: -10px;}

#cms_5-c .box_txt1::before {
    content: "" !important;
    background-image: url(dup/img/A.png) !important;
    background-repeat: no-repeat;
    background-size: contain;
    width: 50px;
    height: 45px;
    position: absolute;
    top: 8px;
    left: -10px;}
    
#cms_5-c .box_title1 {border-color: rgba(255,255,255,1);}

div#cms_5-c .cate_box {
    background: #fffaf2;
    padding: 0px 0px 15px 0;
    border-radius: 10px;
}




/*タブレット*/
@media screen and (max-width: 768px){
.catch {
    z-index: 2;
    max-width: 350px;
    left: 30%;
    top: 41%;}
    
#logo {max-width: 210px !important;}

#intro .num {
    width: 90px;
    height: 70px;
    top: -37px;}
    
#contents1 .num {
    width: 90px;
    height: 70px;
    top: -36px;
    left: 41.5%;}
    
#contents2 .num {
    width: 90px;
    height: 70px;
    left: 41.5%;}
    
#contents3 .num {
    width: 90px;
    height: 70px;
    top: -37px;}
    
.banner {
    padding-top: 100px;
    padding-bottom: 0;}

p#logo2 a {max-width: 180px;}

#page_title .title_img {height: 430px;}
}



/*スマホ*/
@media screen and (max-width: 667px){
#page_title .title_img { height: 300px;}
#page_title .page_title_box {
    padding: 20px 10px 30px;
    top: 58%;}
#fakeloader .fl {max-width: 150px !important;}

#cms_5-c .box_title1::before {
    width: 40px;
    height: 35px;
    top: 9px;
    left: -14px;}
#cms_5-c .box_txt1::before {
    width: 40px;
    height: 35px;
    top: 9px;
    left: -14px;}
#cms_5-c .box_title1,#cms_5-c .box_txt1 { padding-right: 5px;}

div#main_img {padding-top: 50px;}
.catch {
    z-index: 2;
    max-width: 217px;
    left: 31%;
    top: 44%;}
.intro_title h3 {font-size: 20px;}

#intro .num {
    width: 80px;
    height: 60px;
    top: -37px;}

#contents1 .num {
    width: 80px;
    height: 60px;
    top: -36px;
    left: 50%;}

#contents2 .num {
    width: 80px;
    height: 60px;
    left: 50%;
    top: -36px;}

#contents3 .num {
    width: 80px;
    height: 60px;
    top: -37px;}

.back1:before, .back2:before {
    background-image: url(Dup/img/bg_img.jpg) !important;
    background-size: 140%;}

.banner { padding-top: 80px;
        width: 85%;}
.banner img {padding: 15px 0px;}
.cms_2-d .cate_box { padding: 15px;}

div#cms_1-a .grid_10_sp {
    width: 100% !important;
    margin: 5px auto !important;}
}


/*IE*/
@media all and (-ms-high-contrast: none){
.pager li a {padding-bottom: 10px !important;}

#cms_2-d .cate_title{ padding-bottom: 13px !important;}
#contact_tel a{padding-top:23px !important;}
#page10 .more_btn {padding-top: 10px !important;}
.cate_list li a{
    padding-top: 10px !important;
    padding-bottom: 11px !important;}


}