@charset "UTF-8";

:root {
/* 共通設定（基本カラーなどなど） */
}

/*-------------------------
__base_style
-------------------------*/
#wrap{ text-align: left;}
.go_text,
#asp_content{ font-family:'游ゴシック Medium','Yu Gothic Medium','游ゴシック体', YuGothic,'Yu Gothic','Hiragino Kaku Gothic ProN','Hiragino Sans',sans-serif; }
#wrap{ min-width: 1200px;}
a[href^="tel:"] { pointer-events: none; cursor: default; text-decoration: none;}

/*-------------------------
__header
-------------------------*/
#header{ position: fixed; top: 0; left: 50%; transform: translateX(-50%); z-index: 1; width: 100%; z-index: 200; transition: background .3s;}
#header .header_inner{ display: flex; justify-content: space-between; align-items: center; width: 1200px; margin: 0 auto; padding: 20px 50px; box-sizing: border-box;}
#header .header_inner .com_logo{ width: 220px; height: auto;}
#header .header_inner .com_logo img{ width: 100%; height: auto;}
#header .header_inner ul{ display: flex;}
#header .header_inner ul li{ margin: 0 13px;}
#header .header_inner ul li a{ font-size: 1.8em; color: #fff; text-decoration: none; padding: 0 10px; box-sizing: border-box;}
#header.on{ width: 100%; background-color: rgba(40,60,40,0.9);}
.hamburger{ display: none;}
.sp_only{ display: none;}
.pc_none{ display: none;}
#header .header_inner ul li a{ transition: .2s;}
#header .header_inner ul li a:hover{ opacity: 0.4;}

@media screen and (max-width:999px) and (min-width: 768px){
.tab_none{ display: none;}
}

/*-------------------------
__content
-------------------------*/
.contents_page_title{ width: 100%; height: 400px; background: linear-gradient(-25deg, rgb(40, 60, 40) 0%, rgb(83, 99, 83) 100%); margin-bottom: 100px; position: relative;}
.contents_page_title:before{ content: ''; display: inline-block; width: 670px; height: 400px; background-image: url(/images/contents_title_back.png); background-size: cover; position: absolute; top: 0; left: 0; z-index: 0; mix-blend-mode: multiply;}
.contents_page_title .contents_page_title_inner{ width: 100%; max-width: 1200px; height: 100%; margin: 0 auto; position: relative;}
.contents_page_title .contents_page_title_inner .page_title_text{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-align: center; margin-top: 20px;}
.contents_page_title .contents_page_title_inner .page_title_text h1{}
.contents_page_title .contents_page_title_inner .page_title_text h1 .jp_text{ display: block; color: #fff; font-size: 1.5em;}
.contents_page_title .contents_page_title_inner .page_title_text h1 .en_text{ display: block; height: 100px; margin-bottom: 20px;}
.contents_page_title .contents_page_title_inner .page_title_text h1 .en_text img{ height: 100%; width: auto;}
.contents_page_title .contents_page_title_inner .topic_path{ position: absolute; bottom: 20px; right: 50px;}
.topic_path{clear:both;padding:0;}
.topic_path ul{width:100%;text-align:left;}
.topic_path li{font-size:1.4em;line-height:1.4;font-weight:700;color:#fff;vertical-align:top;display:inline-block;}
.topic_path li:before{content:"/";color:#fff;font-weight:400;margin-left:5px;margin-right:5px;}
.topic_path li:first-child:before{content:"";margin:0;}
.topic_path li a{font-weight:400;color:#fff;text-decoration:underline;}
.topic_path li a:hover{text-decoration:none;}
#content #main{display:block;}

/*-------------------------
__footer
-------------------------*/
#footer{  background: linear-gradient(-25deg, #283c28 0%, #536353 100%); position: relative;}
#footer .footer_inner{ width: 100%; max-width: 1200px; margin: 0 auto; padding: 50px 50px; box-sizing: border-box; display: flex; justify-content: center;}
#footer .footer_inner .footer_box01{ width: 30%;}
#footer .footer_inner .footer_box01 .com_logo{ width: 100%; max-width: 255px; margin:0 0 20px 0;}
#footer .footer_inner .footer_box01 .com_logo img{ width: 100%; height: auto;}
#footer .footer_inner .footer_box01 .com_data{ font-size: 1.4em; line-height: 1.5; color: #fff;}
#footer .footer_inner .footer_box01 .com_data p{}
#footer .footer_inner .footer_box01 .com_data p a{ color: #fff;}
#footer .footer_inner .footer_box02{ width: 45%;}
#footer .footer_inner .footer_box02 .footer_search{}
#footer .footer_inner .footer_box02 .footer_search p{ color: #fff; font-size: 1.6em;}
#footer .footer_inner .footer_box02 .footer_search p span{ display: block; position: relative;}
#footer .footer_inner .footer_box02 .footer_search p span::after { position: absolute; content: ""; top: 50%; right: 0; width: calc(100% - 80px); height: 1px; background-color: #677567;}
#footer .footer_inner .footer_box02 .footer_search ul{ display: flex; flex-wrap: wrap; padding: 20px 0; box-sizing: border-box;}
#footer .footer_inner .footer_box02 .footer_search ul li{ margin-right: 30px;}
#footer .footer_inner .footer_box02 .footer_search ul li a{ color: #fff; font-size: 1.6em; text-decoration: none;}
#footer .footer_inner .footer_box02 .footer_menu{ border-top: 1px solid #677567;}
#footer .footer_inner .footer_box02 .footer_menu ul{ display: flex; flex-wrap: wrap; padding: 20px 0 0; box-sizing: border-box;}
#footer .footer_inner .footer_box02 .footer_menu ul li{ width: 33.3333%; margin-bottom: 15px;}
#footer .footer_inner .footer_box02 .footer_menu ul li a{ color: #fff; font-size: 1.6em; text-decoration: none;}
#footer .footer_inner .footer_box03{ width: 25%; display: flex; justify-content: flex-end; align-items: center;}
#footer .footer_inner .footer_box03 .instagram{ width: 45px;}
#footer .footer_inner .footer_box03 .instagram a{ display: block;}
#footer .footer_inner .footer_box03 .instagram a img{ width: 100%; height: auto;}
#footer .footer_inner .footer_box03 .contact_btn{ margin-left: 20px;}
#footer .footer_inner .footer_box03 .contact_btn a{ display: inline-block; text-decoration: none;}
#footer .footer_inner .footer_box03 .contact_btn a span{ font-size: 1.6em; font-weight: 600; text-align: center; line-height: 50px; width: 200px; height: 50px; margin: auto; position: relative; display: block; overflow: hidden; transition: 0.5s; color: #fff; border:1px solid #fff;}
#footer .footer_inner .footer_box03 .contact_btn a span:after{ content: ''; display: inline-block; width: 0; height: 0; border-style: solid; border-top: 3px solid transparent; border-bottom: 3px solid transparent; border-right: 0; position: absolute; left: 20px; top: 50%; transform: translateY(-50%); border-left: 6px solid #fff;}
#footer .copylight{ background-color: #000; text-align: center; padding: 10px 50px; box-sizing: border-box;}
#footer .copylight p{ color: #fff; font-size: 1.2em;}
.re_top{ position: fixed; bottom: 20px; right: 20px; z-index: 200; display: none;}
.re_top a{ display: block; width: 80px; height: 80px;}
.re_top a img{ width: 100%; height: auto;}

#footer .footer_inner .footer_box01 .com_data p a,
#footer .footer_inner .footer_box02 .footer_search ul li a,
#footer .footer_inner .footer_box02 .footer_menu ul li a{ transition: .2s;}
#footer .footer_inner .footer_box01 .com_data p a:hover{ opacity: 0.4;}
#footer .footer_inner .footer_box02 .footer_search ul li a:hover,
#footer .footer_inner .footer_box02 .footer_menu ul li a:hover{ opacity: 0.4;}
#footer .footer_inner .footer_box03 .contact_btn a span:after{ transition: all 0.2s;}
#footer .footer_inner .footer_box03 .contact_btn a span:hover:after{ left: 25px;}
#footer .footer_inner .footer_box03 .instagram a img{ transition: .2s;}
#footer .footer_inner .footer_box03 .instagram a:hover img{ opacity: 0.4;}
#footer .footer_inner .footer_box03 .contact_btn a span{}
#footer .footer_inner .footer_box03 .contact_btn a:hover span{ background-color: #fff; color: #205a32;}
#footer .footer_inner .footer_box03 .contact_btn a:hover span:after{ border-left: 6px solid #205a32;}

/*-------------------------
__footer
-------------------------*/

.error{ text-align: center; margin: 0 auto 100px;}
.error > p{ font-size: 1.6em; line-height: 2.5em; margin-bottom: 40px;}
.error > p a{ color: #205a32;}
.error .back_top{}
.error .back_top a{ display: inline-block; text-decoration: none;}
.error .back_top a span{ font-size: 1.6em; font-weight: 600; letter-spacing: .1em; text-align: center; line-height: 50px; width: 250px; height: 50px; color: #947d3c; background: #FFF; margin: auto; border:1px solid #947d3c; position: relative; display: block; overflow: hidden;}
.error .back_top a span:after { content: ''; display: inline-block; width: 0; height: 0; border-style: solid; border-top: 3px solid transparent; border-bottom: 3px solid transparent; border-left: 6px solid #947d3c; border-right: 0; position: absolute; left: 20px; top: 50%; transform: translateY(-50%); transition: all 0.2s;}
.error .back_top a:hover span{ transition: 0.5s; color: #fff; background-color: #947d3c;}
.error .back_top a:hover span:after { left: 25px; border-left: 6px solid #fff;}

/*-------------------------
__drawer
-------------------------*/
#toggle,
#nav-content{ display: none;}

/*-------------------------
__asp
-------------------------*/

#asp_content{ max-width: 1200px; margin: 0 auto; padding: 100px 50px 0; box-sizing: border-box;}
.asp_pageTitle{ font-size: 2.5em; margin: 0 auto 20px!important; padding-left: 35px!important; box-sizing: border-box; position: relative;}
.asp_pageTitle:before{ content: ''; display: block; width: 20px; height: 20px; background-color: #205a32; position: absolute; top: 13px; left: 0; z-index: 0;}