﻿@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Mincho&display=swap');
#intro h2,#contents h3,#top_cms h2,#page_title h2,.cate_title{font-family: 'Sawarabi Mincho', sans-serif;}
#page_title h2{font-weight: normal;}
#fakeloader,#page-top a{background: none!important;background-color: #0c0c0c!important;}
#fakeloader,#page-top a,.drawer--left .drawer-nav{background: none!important;background-color: #0c0c0c!important;}

/* color */
.linkStyle{color: #948874;}
body,.txt_color_nomal{color: #333333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #0c0c0c} /* メインカラー */
.txt_color2{color: #e6e6e6} /* サブカラー */
.txt_color3{color: #948874} /* アクセントカラー1 */
.txt_color4{color: #c9baa9} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background: url( "../dup/img/bg1.jpg" ) left top / cover no-repeat;} /* メインカラー */
.bg_color2{background-color: #e6e6e6} /* サブカラー */
.bg_color3{background-color: #948874} /* アクセントカラー1 */
.bg_color4{background-color: #c9baa9} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}

/* border-color ※!important */
.border_color1{border-color: #0c0c0c}
.border_color2{border-color: #e6e6e6}
.border_color3{border-color: #948874}
.border_color4{border-color: #c9baa9}

/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #333333;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #0c0c0c} /* メインカラー */
.hvr_txt_color2:hover{color: #e6e6e6} /* サブカラー */
.hvr_txt_color3:hover{color: #948874} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #c9baa9} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #0c0c0c} /* メインカラー */
.hvr_bg_color2:hover{background-color: #e6e6e6} /* サブカラー */
.hvr_bg_color3:hover{background-color: #948874} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #c9baa9} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important}

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #0c0c0c}
.hvr_border_color2:hover{border-color: #e6e6e6}
.hvr_border_color3:hover{border-color: #948874}
.hvr_border_color4:hover{border-color: #c9baa9}



/* animation ---------------------------------------------------------------------------------------------*/
.fadein_up{
-webkit-transform: translateY(20px);
transform: translateY(20px);
opacity: 0;
-webkit-transition: transform 1.2s cubic-bezier(.645,.045,.355,1) ,opacity 1.5s cubic-bezier(.645,.045,.355,1) ;
transition: transform 1.2s cubic-bezier(.645,.045,.355,1) ,opacity 1.5s cubic-bezier(.645,.045,.355,1);
}
.fadein_up.start {
transform: translateY(0) scale(1);
opacity: 1;
}
.fadein{
-webkit-transform: translateX(50px);
transform: translateX(50px);
opacity: 0;
-webkit-transition: transform 1.2s cubic-bezier(.645,.045,.355,1) .2s,opacity 1.5s cubic-bezier(.645,.045,.355,1) .2s;
transition: transform 1.2s cubic-bezier(.645,.045,.355,1) .2s,opacity 1.5s cubic-bezier(.645,.045,.355,1) .2s;
}
#contents .box_wrap .box:nth-of-type(2).fadein{
-webkit-transform: translateX(-50px);
transform: translateX(-50px);
}
.fadein.start {
transform: translateX(0)!important;
opacity: 1;
}


/* header ---------------------------------------------------------------------------------------------*/
header{background: rgba(2, 2, 2, 0.55)!important;}
header #header #header_menu li a span{color: #fff!important;}
header #header #header_menu li a span:hover{color: #948874!important;}


/* main_img ---------------------------------------------------------------------------------------------*/
#video{
background-image: url(./dup/img/main_img.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
#video{height: 96vh}
#main_img{max-height: inherit}


/* index.他 ---------------------------------------------------------------------------------------------*/
#main_img .svg_box,.svg_box2,#page_title .svg_box{display: none;}
#intro_txt {background: url(../dup/img/icon1.png) left -30% center / 60% no-repeat #fff;}
#intro h2{font-size: 26px;letter-spacing: 2px;}
#contents h3,#top_cms h2{font-size: 22px;}
#page_title #filter_white{background-color: rgba(201, 186, 169, 0.2)!important;}
.cate_list li a{border-bottom: 1px solid #000;padding-bottom: 0;}
#page8 #tel_contact a:hover,#page8 #form_box #form_bt div:hover{color: #ffffff!important;opacity: 0.6;}
#contents h3 {
position: relative;
padding: 7px 5px 7px 43px;
background: #948874;
font-size: 22px;
color: white;
margin-left: -33px;
line-height: 1.3;
z-index: -1;
border-bottom: 2px solid #160a0a;
}
#contents h3:before {
position: absolute;
content: '';
left: -2px;
bottom: -5px;
border: none;
border-left: solid 38px white;
border-bottom: solid 82px transparent;
z-index: -2;
}
#contents .box_wrap .box:nth-of-type(2) h3{margin-left: 8.33333%;padding: 7px 43px 7px 19px;}
#contents .box:nth-of-type(2) h3:before{left: auto;right: -2px;border: none;border-right: solid 38px white;border-bottom: solid 82px transparent;}


/* cms ---------------------------------------------------------------------------------------------*/
#cms_3-e .cate_title{
background: url( "../dup/img/bg1.jpg" ) left top / cover no-repeat;
border-left: 10px solid #948874;
padding: 10px;
}
#cms_3-e .cate_box,#cms_2-c .cate_box{padding: 30px 0;}
#cms_2-c .cate_title{
position: relative;
padding: 7px 5px 7px 43px;
background: #948874;
color: white;
margin-left: -33px;
line-height: 1.3;
z-index: -1;
border-bottom: 2px solid #160a0a;
}
#cms_2-c .cate_title:before {
position: absolute;
content: '';
left: -2px;
bottom: -5px;
border: none;
border-left: solid 38px white;
border-bottom: solid 82px transparent;
z-index: -2;
}


/* footer ---------------------------------------------------------------------------------------------*/
#footer{color: #fff;}
footer .bg-mask{background: rgba(0, 0, 0, 0)!important;}


/* IE */
@media all and (-ms-high-contrast: none){
#contents h3 {padding: 7px 5px 2px 43px;}
#contents .box_wrap .box:nth-of-type(2) h3{padding: 7px 43px 2px 19px;}
#cms_3-e .cate_title{padding: 10px 10px 5px 10px;}
#page_title h2 span{padding-top: 16px;}
#cms_2-b .cate .cate_title{padding-top: 15px;}
}
/* Edge */
@supports (-ms-ime-align: auto) {
#intro,#info_title_box{background-position: center!important;background-repeat: no-repeat!important;background-attachment: fixed!important;}
}
/* Edge タブレット以下 */
@media all and (max-width: 768px){
@supports (-ms-ime-align:auto){
#intro,#info_title_box{background-position: center!important;background-repeat: no-repeat!important;background-attachment: scroll!important;}
}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
#video{height: auto;}
#video{height: 50vh;}/*動画来たら消す*/
.video{transform: none;width: 100%!important}
header #header #header_menu li{width: auto;}
#intro h2{font-size: 26px;}
#header .logo{width: 200px;}
}


/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
#logo{padding-top: 13px;}
.drawer-hamburger{transform: translateY(6px);}
.drawer-hamburger-icon,.drawer-hamburger-icon::after, .drawer-hamburger-icon::before{background: none;background-color: rgb(255, 255, 255)!important;}
.drawer-open .drawer-hamburger-icon{background-color: transparent!important;}
.cate_list li a{padding-bottom: 5px;}
#intro_txt{background: url(../dup/img/icon1.png) top 30px center / 47% no-repeat #fff;}
#intro h2{font-size: 20px;}
#contents .grid_11{width: 100%!important;}
#contents h3,#contents .box_wrap .box:nth-of-type(2) h3{margin-left: 0;font-size: 18px;padding: 7px 5px 7px 37px;}
#contents .box_wrap .box:nth-of-type(2) h3 {padding: 7px 25px 7px 15px;}
#cms_3-e .cate_box,#cms_2-c .cate_box{padding: 20px 0;}
#cms_3-e .cate_title,#cms_2-c .cate_title{text-align: left;}
#cms_2-c .cate_title{margin-left: 0;padding: 7px 5px 7px 25px;}
#cms_2-c .box_txt1{color: #948874;}
#cms_3-e .cate_box .box_description2{padding-left: 13px;}
#cms_3-e .cate_box .box_description2 .box_txt1{color: #948874!important;}
}