@charset "utf-8";

/* コンテンツ横幅を固定 */
@media (min-width:641px) {
 html {
  min-width:1142px;}
}

/* 必要なレスポンシブ対応を記載 */
@media (max-width:640px) {
 html {
  min-width:inherit;}
}

/* コンテンツ横幅を固定 */
@media (min-width:641px) {
 html.modepc {
  min-width:inherit;}
}

.pc {
 display: block;}

.sp {
 display: none;}

@media (min-width: 641px) {
 .wp-block-column:not(:first-child) {
  margin-left: 1em !important;}
}

@media (max-width: 640px) {
 .pc {
  display: none;}

 .sp {
  display: block;}
}

.wrap {
 margin: auto;}

#pagetop {
 position: fixed;
 right: 3rem;
 bottom: 3rem;
 z-index: 3;}

#pagetop a {
 display: block;
 position: relative;
 width: 50px;
 height: 50px;
 background: #803F3F;}

#pagetop a::before {
 position: absolute;
 display: block;
 content: '';
 top: 20px;
 right: 18px;
 width: 10px;
 height: 10px;
 border-top: 4px solid #ffffff;
 border-right: 4px solid #ffffff;
 transform: rotate(-45deg);}

body {
 background: no-repeat center/cover url("../img/bg.jpg");}

h3,
h4,
h5 {
 font-weight: 500;}

h3 {
 font-size: 2.8rem;
 font-weight: 500;
 margin: 0 auto 4rem;
 padding: 0 0 1.4rem;
 position: relative;
 text-align: center;
 letter-spacing: 0.2em;}

h3::after {
 content: '';
 border-bottom: 2px solid #803F3F;
 margin: auto;
 width: 6.8rem;
 position: absolute;
 bottom: 0;
 left: -0.07em;
 right: 0;}

h3 small {
 display: block;
 margin-top: -5px;}

h4 {
 font-size: 2.4rem;
 letter-spacing: .15em;
 margin: 0 0 1.5rem;
 font-weight: 500;
 line-height: 3.4rem ;}

h5 {
 font-size: 2.2rem;
 letter-spacing: .15em;
 margin: 0 0 1.5rem;
 font-weight: 500;
 line-height: 3.4rem ;}

h6 {
 color: #803F3F;
 font-size: 1.8rem;
 font-weight: 400;
 margin: 0 0 3rem;}

.under .content .wrap a:not(.wp-block-button__link) {
 color: #000;}

.under .content p.btn{
 margin-bottom: 2.5rem ;}

.btn a {
 background: #373737;
 color: #fff !important;
 display: inline-block;
 float: right;
 margin: 0 0 0.5rem 1rem;
 padding: 0.6rem 3rem 0.6rem 2rem;
 text-align: center;
 text-decoration: none !important;
 min-width: 15rem;
 max-width: 100%;
 font-weight: 500;
 letter-spacing: 0.11em;
 position: relative;
 z-index: 0;
 font-size: 95%;}

.btn a::before {
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 z-index: -1;
 content: '';
 background: #803F3F;
 transform-origin: left top;
 transform: scale(0, 1);
 transition: transform .1s;}

.btn a::after {
 position: absolute;
 display: block;
 width: 11px;
 height: 11px;
 content: url("../img/btn_allow_gold.svg");
 right: 10px;
 top: calc(50% - 13.5px);}

.btn::after {
 content: "";
 display: block;
 clear: both;}

.btn a:hover {
 opacity: 1;}

.btn a:hover::before {
 transform-origin: left top;
 transform: scale(1, 1);}

.under .content {
 max-width: 126rem;
 margin: auto;}

.under .content .head {
 position: relative;}

.under .content .head h2 {
 background: #fff;
 border-bottom: 2px solid #803F3F;
 display: inline-block;
 font-size: 3rem;
 font-weight: 400;
 padding: 2rem 3rem;
 min-width: 32rem;
 position: absolute;
 bottom: -4rem;
 left: 6.5rem;
 letter-spacing: .3rem;}

.under .content .breadcrumbs {
 margin: 0 0 11rem;
 text-align: right;}

.under .content .breadcrumbs img {
 vertical-align: baseline;}

.under .content .breadcrumbs span {
 color: #646464;
 font-size: 1.4rem;
 letter-spacing: .2rem}

.under .content .wrap {
 flex: 1 1 10%;
 max-width: 98rem;
 margin: -2rem auto 10rem;}

.under .content .wrap > *:not(.wp-block-image):not(.menu_under):not(.wp-block-group),
.under .content .wrap .wp-block-group__inner-container > *:not(.wp-block-image) {
 max-width: 88rem;
 margin-left: auto;
 margin-right: auto;}

.under .wp-block-group {
 margin: 0 0 13rem;}

.under .wp-block-group.mbA,
.under .content .wp-block-columns.mbA {
 margin-bottom: 13rem;}

.under .wp-block-group.mbB,
.under .content .wp-block-columns.mbB,
.under .content .box.mbB {
 margin-bottom: 6rem;}

.under .wp-block-group.mbC,
.under .content .wp-block-columns.mbC,
.under .content .box.mbC {
 margin-bottom: 12rem;}

.under .wp-block-group.mbC7,
.under .content .wp-block-columns.mbC7,
.under .content .box.mbC7 {
 margin-bottom: 7rem;}

.under .wp-block-group.mbD,
.under .content .wp-block-columns.mbD,
.under .content .box.mbD {
 margin-bottom: 6.5rem;}

.under .wp-block-group.mb10 {
 margin-bottom: 10rem;}

.under .content p {
 margin: 0 auto 3rem;
 letter-spacing: .08em;
 text-align: justify;}

.under .content p.kome,
.under .content p.kome_indent,
.under .content .kome,
.under .content .kome_indent {
 display: block;
 margin: 0 auto 3rem;
 letter-spacing: 0.08em;
 font-size: 1.4rem;
 line-height: 1.8em;
 text-align: justify;}

.under .content p.kome_indent,
.under .content .kome_indent {
 margin: 0 0 0 1.8rem;
 text-indent: -1.6rem;}

.under .content .komebox,
.under .content .komebox_indent {
 display: block;
 margin: 0 auto 3rem;}

.under .content .komebox span,
.under .content .komebox_indent span {
 display: block;
 letter-spacing: 0.08em;
 font-size: 1.4rem;
 line-height: 1.8em;
 text-align: justify;}

.under .content .komebox_indent span {
 margin: 0 0 0 1.8rem;
 text-indent: -1.6rem;}

.wp-block-button__link {
 min-width: 30rem;}

.under .content .wp-block-separator {
 border-top: none;
 border-bottom: 1px dashed #bbb;}

.under .content h4 + .wp-block-separator {
 margin-top: -0.5rem;}

.has-background {
 padding: 2rem;}

.under_h2 {
 text-align: center;}

.under .content .wrap h2 {
 background: #ececea;
 display: inline;
 font-size: 2.6rem;
 font-weight: 500;
 letter-spacing: 1.1rem;
 padding: 2.5rem 2rem 1.7rem 2rem;
 margin: 0 auto 8rem;
 writing-mode: vertical-rl;
 -ms-writing-mode: tb-rl;
 -webkit-writing-mode: vertical-rl;
 word-break: keep-all;
 white-space: nowrap;}

.under .content .wrap h2::before {
 content: url(../img/under_h2.svg);
 margin: 0 0 2rem;
 position: relative;
 display: inline-block;}

@media (max-width: 767px) {
 body.modepc.under .content .wrap h2 {
  letter-spacing: 1rem;
  padding: 2.5rem 3rem 1.5rem;}
}

@media (max-width: 640px) {
 .under .content .wrap h2 {
  letter-spacing: 1rem;
  padding: 2.5rem 3rem 1.5rem;}
}

.under .content .wp-block-image {
 margin: 0 0 4rem;}

.under .content .wp-block-image figcaption {
 font-size: .8em;
 margin: .3rem 0 -2.2rem;
 text-align: right;
 letter-spacing: 0.1rem;}

.under .content .wp-block-image figcaption a:not(.wp-block-button__link){
 color: #000000 ;}

.under .content .wp-block-columns {
 margin: 0 0 4.5rem;}

.under .content .wp-block-columns.mb4 {
 margin-bottom: 4rem;}

.under .content .wp-block-columns .wp-block-image {
 margin: 0;}

.under .content .wp-block-columns .wp-block-image img {
 margin-top: 6px;}

.under .content .wp-block-columns .wp-block-column > p:first-child {}

.under .content .wp-block-columns .wp-block-column > p:last-child {
 margin-bottom: 0;}

@media (max-width: 767px) {
 body.modepc.under .content .wp-block-columns .wp-block-image,
 .under .content .wp-block-image {
  margin: 0 0 2rem;}

 body.modepc.under .content .wp-block-image figcaption {
  margin: .3rem 0 1rem;}

 body.modepc.under .content .wp-block-columns.mb4 {
  margin-bottom: 0;}
}

@media (max-width: 640px) {
 .under .content .wp-block-columns .wp-block-image,
 .under .content .wp-block-image {
  margin: 0 0 2rem;}

 .under .content .wp-block-image figcaption {
  margin: .3rem 0 1rem;}

 .under .content .wp-block-columns.mb4 {
  margin-bottom: 0;}
}

.under .content .wrap ul,
.under .content .wrap ol {
 margin: 0 0 3rem;}

.under .content .wrap ul li,
.under .content .wrap ol li {
 position: relative;
 margin: 0 0 1.5rem 0;
 letter-spacing: 0.08rem;}

.under .content .wrap ol li {
 margin: 0 0 1.5rem 1.4em;}

.under .content .wrap ul li ul,
.under .content .wrap ol li ul {
 margin: 1rem 0 0 3rem;
 position: relative;}

.under .content .wrap ul li {
 margin: 0 0 1.5em 1em;}

.under .content .wrap ul li::before {
 position: absolute;
 top: 10px;
 left: -13px;
 content: '';
 display: inline-block;
 background: #803F3F;
 width: .6rem;
 height: .6rem;}

.under .content ol {
 counter-reset: item;
 list-style-type: none;}

.under .content ol li::before {
 counter-increment: item;
 content: counter(item) ".";
 color: #803F3F;
 position: absolute;
 left: -2rem;}

.under .content ol li ul li::before {
 counter-reset: item;}

.under .content ol li ul li::before,
.under .content ol li ul li ul li::before,
.under .content ol li ol li::before,
.under .content ol li ol li ul li::before {
 counter-reset: item;}

.under .content .wp-block-table table {
 margin: 0 0 6rem;
 overflow-x: auto;
 width: 100%;}

.under .content .wp-block-table table th,
.under .content .wp-block-table table td {
 border: 1px solid #D9D9D9;
 padding: 1.5rem 3rem;}

.under .content .wp-block-table table th {
 background: #646464;
 color: #fff;
 font-weight: 500;
 text-align: left;
 letter-spacing: 0.08em;
 font-size: 1.5rem;
 line-height: 1.6em;}

.under .content .wp-block-table table td {
 background: #fff;
 letter-spacing: 0.08em;
 font-size: 1.5rem;
 line-height: 1.6em;}

.under .content .question dt,
.under .content .question dd {
 font-weight: 500;
 padding: 2.2rem 3.5rem 2.2rem 2.2rem;}

.under .content .question dt {
 background: #4D4D4D;
 border-bottom: 1px solid #F1F1F1;
 color: #F1F1F1;
 cursor: pointer;
 letter-spacing: 0.08em;
 position: relative;}

.under .content .question dt::before {
 content: 'Q.';
 font-weight: 500;
 display: inline-block;
 margin: 0 .5rem 0 0;}

.under .content .question dt::after {
 content: url(../img/btn_allow_gold.svg);
 position: absolute;
 right: 2rem;
 top: calc(50% - 14px);
 transform: rotate(90deg);}

.under .content .question dt.open::after {
 transform: rotate(-90deg);}

.under .content .question dd {
 background: #fff;
 display: none;}

.under .content .question dd p::before {
 content: 'A.';
 color: #803F3F;
 font-weight: 500;
 display: inline-block;
 margin: 0 .5rem 0 0;}

.under .content .question dd p.btn {
 overflow: hidden;}

.under .content .question dd p.btn a {
 margin-bottom: 10px;}

.under .content .question dd p.btn::before {
 display: none;}

.under .content form dl {
 flex-wrap: wrap;}

.under .content form dt,
.under .content form dd {
 margin: 0 0 2.6rem;}

.under .content form dt {
 flex-basis: 25%;}

.under .content form dt span {
 background: #803F3F;
 color: #fff;
 display: inline-block;
 font-size: 1.4rem;
 margin: 0 0 0 1rem;
 padding: 0 1rem;}

.under .content form dd {
 flex-basis: 75%;}

.under .content form dd input,
.under .content form dd textarea {
 border: 1px solid #D9D9D9;
 border-radius: 4px;
 width: 100%;}

.under .content form dd input {
 height: 3.6rem;}

.under .content form dd input.short {
 max-width: 36rem;}

.under .content form dd textarea {
 height: 22rem;}

.under .content form .form_btn {
 text-align: center;}

.under .content form .form_btn input {
 border: none;
 color: #fff;
 margin: 0 2rem 1rem;
 text-align: center;
 padding: 1rem 0;
 width: 20rem;}

.under .content form .form_btn input[type="submit"] {
 background: #373737;}

.under .content form .form_btn input[type="reset"] {
 background: #8F8F8F;}

.under .wrap .menu_under {
 background: #F2F2EF;
 display: flex;
 align-items: center;
 padding: 2rem 3rem;
 margin: 5rem auto 8rem auto;}

.under .wrap .menu_under p {
 font-size: 2rem;
 margin: 0;}

.under .wrap .menu_under p::after {
 content: '';
 border-right: 1px solid #707070;
 display: inline-block;
 height: 6rem;
 vertical-align: middle;
 margin: 0 2rem;
 transform: rotate(15deg)}

.under .wrap .menu_under ul {
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 flex: 1 1 10%;
 margin: 0;
 list-style: none;}

.under .wrap .menu_under ul li {
 margin: 0;}

.under .wrap .menu_under ul li:not(:last-child) {
 margin-right: 3.5rem;}

.under .wrap .menu_under ul li::before {
 content: none;}

.under .content .wrap .menu_under ul li a {
 position: relative ;
 color: #000;
 text-decoration: none !important;}

.under .wrap .menu_under ul li a::before {
 content: url("../img/btn_allow_gold.svg");
 display: inline-block;
 margin: 0 0.5rem 0 0;}

.under .menu_under ul li.active a {
 pointer-events: none;}

.under .menu_under ul li.active a::before {
 content: none;}

.under .menu_under ul li.active a::after {
 position: absolute ;
 content: '';
 display: block;
 border-top: 2px solid #803F3F;
 width: 3rem;
 left: calc(50% - 1.5rem);}

.under .event {
 align-items: center;
 background: #fff;
 display: flex;
 margin: 0 0 3rem;
 padding: 3rem 3rem 3rem 0;}

.under .event .right {
 font-size: 2rem !important;
 font-weight: 500;
 flex-basis: 30%;
 margin: 0;
 text-align: center;}

.under .content .wrap .event ul {
 flex-basis: 80%;
 margin: 0;}

.under .content .wrap .event li {
 margin: 0 0 .1rem;}

.under .content .event ul li::before {
 content: none;}

.under .content .wrap .event li a {
 color: #000;
 display: flex;
 position: relative;
 text-decoration: none;}

.under .content .wrap .event li a p {
 font-weight: 500;}

.under .content .event li a:not(.nolink) {
 background: #F7F7F7;
 padding: 2rem 4.5rem 2rem 2rem;}

.under .content .event li a.nolink {
 pointer-events: none;}

.under .content .event li a p {
 margin: 0;
 font-weight: 500;}

.under .content .event li a p.date {
 flex-basis: 25%;
 font-weight: 400;
 margin: 0 1rem 0 0;}

.under .content .event li a p.date + p {
 flex: 1 1 10%;}

.under .content .event li a:not(.nolink)::after {
 content: url('../img/btn_allow_gray.svg');
 position: absolute;
 right: 3rem;
 top: calc(50% - 14px);}

.under .col2 {
 display: flex;}

.under .sidebar {
 max-width: 100%;
 width: 23rem;
 margin: 0 5rem 18rem 0;}

.under .sidebar ul.side_aco {
 background: #F9F9F8;
 border-left: 2px solid #373737;
 position: sticky;
 top: 3rem;}

.under .sidebar ul.side_aco > li > a {
 position: relative;}

.under .sidebar ul.side_aco > li > a::after {
 content: url(../img/btn_allow_gold.svg);
 float: right;
 margin: 0 1rem 0 0;
 transform: rotate(90deg);}

.under .sidebar ul.side_aco > li.open > a::after {
 transform: rotate(-90deg);}

.under .sidebar ul.side_aco li ul li:first-child {
 border-top: 1px dashed #D8D8D8;}

.under .sidebar ul.side_aco li ul li:last-child {
 border: none;}

.under .sidebar ul.side_aco > li:not(.active) > ul {
 display: none;}

.under .sidebar ul li {
 margin: 0 .7rem;}

.under .sidebar ul li:not(.sub li:last-child) {
 border-bottom: 1px dashed #D8D8D8;}

.under .sidebar ul li a,
.under .sidebar ul li span {
 display: block;
 letter-spacing: .1em;
 padding: .3rem 0 .3rem 1.5rem;}

.under .sidebar ul li ul li a,
.under .sidebar ul li ul li span {
 padding-left: 2.5rem;
 font-size: 1.4rem;}

.under .sidebar ul li ul li ul li a,
.under .sidebar ul li ul li ul li span {
 padding-left: 3.4rem;}

.under .sidebar ul.sub li:first-child {
 border-top: 1px dashed #D8D8D8;}

.under .sidebar ul.sub li a {
 padding: 0.3rem 0 0.3rem 3.4rem;
 pointer-events: auto;}

/* ブラウザ両端に触れないようにする
----------------------------------------*/
@media (max-width: 1300px) {
 body.modepc.under .content .head h2 {
  display: block;
  position: initial;
  font-size: 2.5rem;
  padding: 1rem 3rem;}

 body.modepc.under .content .wrap {
  margin: 0 auto 8rem;}

 .under .content .breadcrumbs {
  margin: 0 5% 11rem;}

 .under .wrap .menu_under {
  margin: 8rem auto 0;}

 .under .col2 {
  margin: 0 0 8rem;
  flex-direction: column;}

 .col2{
  margin: 0 5% 8rem;}
 
 .under .sidebar {
  display: none;
  width: 100%;
  margin: 0;
  padding: 0 5%;}
}

@media (max-width: 640px) {
 .under .content .head h2 {
  display: block;
  position: initial;
  font-size: 2.5rem;
  min-width: inherit ;
  padding: 1rem 3rem;}

 .under .content .wrap {
  margin: 0 auto 8rem;}

 .under .content .breadcrumbs {
  margin: 0 5% 11rem;}

 .under .wrap .menu_under {
  margin: 8rem auto 0;}

 .under .col2 {
  margin: 0 0 8rem;
  flex-direction: column;}

 .under .sidebar {
  display: none;
  width: 100%;
  margin: 0;
  padding: 0 5%;}
}

/* コンテンツ幅（980px=98rem）がブラウザ両端に触れないようにする
----------------------------------------*/
@media (max-width: 1000px) {
 body.modepc.under .content .wrap {
  margin: 0 5% 8rem;}

 body.modepc.under .content .wp-block-table table {
  width: 100%;
  border-bottom: 1px solid #D9D9D9;
  display: block;}

 body.modepc.under .content .wp-block-table table thead {
  display: none;}

 body.modepc.under .content .wp-block-table table tbody,
 body.modepc.under .content .wp-block-table table tbody tr,
 body.modepc.under .content .wp-block-table table tbody th,
 body.modepc.under .content .wp-block-table table tbody td {
  width: 100%;
  display: block;}

 body.modepc.under .content .wp-block-table table th,
 body.modepc.under .content .wp-block-table table td {
  border-bottom: none;}

 body.modepc.under .content .wp-block-table table tbody td.th {
  background: #646464;
  text-align: center;
  border-bottom: none;
  color: #ffffff;}

 .under .event .right {
  font-size: 1.6rem !important;
  margin: 0 1.5rem;}

}

@media (max-width: 640px) {
 .under .content .wrap {
  margin: 0 5% 8rem;}

 .under .content .wp-block-table table {
  width: 100%;
  border-bottom: 1px solid #D9D9D9;
  display: block;}

 .under .content .wp-block-table table thead {
  display: none;}

 .under .content .wp-block-table table tbody,
 .under .content .wp-block-table table tbody tr,
 .under .content .wp-block-table table tbody th,
 .under .content .wp-block-table table tbody td {
  width: 100%;
  display: block;}

 .under .content .wp-block-table table th,
 .under .content .wp-block-table table td {
  border-bottom: none;}

 .under .content .wp-block-table table tbody td.th {
  background: #646464;
  text-align: center;
  border-bottom: none;
  color: #ffffff;}

 .under .event .right {
  font-size: 1.6rem !important;
  margin: 0 1.5rem;}

}

/* 
----------------------------------------*/
@media (max-width: 767px) {
 body.modepc.under .content .breadcrumbs {
  margin: 0 5% 3rem;}

 body.modepc.under .content p {
  margin: 0 auto 3rem;}

 body.modepc.under .content form dl {
  display: block;}

 body.modepc.under .content form dt {
  margin: 0 0 1rem;}

 body.modepc.under .wrap .menu_under {
  flex-direction: column;
  padding: 2rem 1rem 1rem 1rem ;}

 body.modepc.under .wrap .menu_under p{
  margin-bottom: 2rem ;}

 body.modepc.under .wrap .menu_under p::after {
  content: none;}

 body.modepc.under .wrap .menu_under ul{
  width: 100%;
  /*width: calc(100% - 2.8rem);
  margin: 0 1.9rem ;
 */}

 body.modepc.under .wrap .menu_under ul li {
  flex-basis: 100% ;
  margin: 0 0 1rem 0 ;}

 .under .wrap .menu_under ul li:not(:last-child){
  margin-right:3.5rem;
 }
}

@media (max-width: 640px) {
 .under .content .breadcrumbs {
  margin: 0 5% 3rem;}

 .under .content p {
  margin: 0 auto 3rem;}

 .under .content form dl {
  display: block;}

 .under .content form dt {
  margin: 0 0 1rem;}

 .under .wrap .menu_under {
  flex-direction: column;
  padding: 2rem 1rem 1rem 1rem ;}

 .under .wrap .menu_under p{
  margin-bottom: 2rem ;}

 .under .wrap .menu_under p::after {
  content: none;}

 .under .wrap .menu_under ul{
  width: calc(100% - 2.8rem);
  margin: 0 1.9rem ;}

 .under .wrap .menu_under ul li {
  flex-basis: 25% ;
  margin: 0 0 1rem 0 ;}

}

/* 
----------------------------------------*/
@media (max-width: 640px) {
 .under .event {
  flex-direction: column;
  padding: 2rem;}

 .under .event ul {
  flex-basis: 100%;
  width: 100%;}

 .under .event .right {
  margin: 0 0 1rem;}

 .under .content .wrap .event li a {
  flex-direction: column;}

 .under .content .event li a p.date + p {
  font-weight: 500;}

 .under .wrap .menu_under ul li:not(:last-child){
  margin-right: 0 ;}

 .under .wrap .menu_under ul li {
  flex-basis: 50% ;}
}

/* 
----------------------------------------*/
@media (max-width: 320px) {
 .under .wrap .menu_under ul li {
  flex-basis: 100% ;}
}

/* language header&footer */
.lang a {
 color: #9F9F9F;
 padding: 0 .5rem;
 font-size: 1.5rem;
 font-weight: 500;
 letter-spacing: 0.13em;}

.lang a:not(:last-child) {
 border-right: 1px solid #9F9F9F;}

header .lang {
 top: -2rem;
 position: absolute;
 right: -5.5rem;
 padding: 0.5rem 0;}

header .lang a:first-child,
header .lang a.active {
 color: #803F3F;}

footer .lang a:first-child,
footer .lang a.active {
 color: #9C8F35;}

.en header .lang a:first-child,
.en footer .lang a:first-child {
 color: #9F9F9F;}

.lang a:last-child {
 padding-right: 0;}

/* header */
header {
 position: relative;}

header .header_wrap {
 align-items: center;
 max-width: 114.2rem;
 margin: 2rem auto 3rem;
 position: relative;
 z-index: 100 ;}

header h1 {
 flex-shrink: 0;}

header nav {
 width: 100%;}

header nav ul.menu_main {
 justify-content: space-around;}

header nav ul li a {
 font-size: 1.7rem;
 letter-spacing: 0.3em;}

.en header nav ul li a {
 letter-spacing: 0.1em;}

header nav ul.menu_main {
 margin-top: 2rem;}

header nav ul.menu_main > li {
 position: relative;
 text-align: center;}

header nav ul.menu_main > li::after {
 content: '';
 display: block;
 width: 14vw;
 max-width: 16rem;
 height: 2px;
 background: #803F3F;
 bottom: 0;
 right: 50%;
 left: 50%;
 transform: scale(0, 1);
 transform-origin: left top;
 transition: 0.2s all;}

header nav ul.menu_main > li > a {
 display: inline-block;
 padding: 0.5em;
 padding: 0 0 1.5rem;
 position: relative;}

header nav ul.sub-menu {
 display: none;
 position: absolute;
 z-index: 1;
 text-align: center;
 /*width: 14vw;*/
 width: 160px ;
 max-width: 16rem;
 top: 100%;
 left: 50%;
 transform: translateX(-50%);}

header nav ul.menu_main > li ul.sub-menu:hover {
 display: block !important;}

header nav ul.menu_main > li:hover::after {
 transform: scale(1);
 transform-origin: left top;}

header nav ul.sub-menu > li > a {
 display: block;
 font-size: 1.4rem;
 width: 100%;
 padding: .7rem;
 background: rgba(55, 55, 55, 0.7);
 color: #fff;
 position: relative;}

header nav ul.sub-menu > li > a:hover {
 background: rgba(55, 55, 55, 1);}

header nav ul.sub-menu > li:not(:last-child) > a::after {
 content: '';
 width: 85%;
 height: 1px;
 background: rgba(255, 255, 255, 0.5);
 position: absolute;
 bottom: 0;
 left: 50%;
 transform: translateX(-50%);}

header nav.pc {
 flex-basis: 40%;}

@media (max-width: 1300px) {
 body.modepc header {
  margin: 0 2%;}

 body.modepc header nav ul.menu_main > li {
  flex-basis: 13vw;}

 body.modepc header nav ul.menu_main > li::after,
 body.modepc header nav ul.sub-menu {
  width: 100%;}

 header .lang {
  right: 1rem;}
}

@media (max-width: 640px) {
 header {
  margin: 0 2%;}

 header nav ul.menu_main > li {
  flex-basis: 13vw;}

 header nav ul.menu_main > li::after,
 header nav ul.sub-menu {
  width: 100%;}

 header .lang {
  right: -1rem;}
}

@media (max-width: 900px) {
 body.modepc header .header_wrap {
  margin: 1rem auto;
  display: block;}

 body.modepc header h1 {
  margin: auto;
  width: 8.2rem;}

 /*  */
 body.modepc header .lang,
 body.modepc header nav {
  display: none;
  position: absolute;}

 body.modepc header.active nav ul.menu_main > li {
  border-bottom: 1px solid #fff;
  width: 100%;
  position: relative;}

 body.modepc header nav ul.menu_main > li:not(.nounder)::after {
  content: none;}

 body.modepc header nav ul.menu_main > li:not(.nounder)::before {
  content: url('../img/btn_allow_white.svg');
  position: absolute;
  right: 10%;
  top: 1rem;
  transform: rotate(90deg);}

 body.modepc header nav ul.menu_main > li.open:not(.nounder)::before {
  transform: rotate(-90deg);}

 body.modepc header.active nav ul.menu_main > li a {
  width: 100%;
  padding: 0.5em 0;
  background: none;}

 body.modepc header.active nav ul.menu_main li ul.sub-menu {
  max-width: 100%;
  width: 100%;}

 body.modepc header.active nav ul.menu_main li ul.sub-menu li {
  background: #404040;}

 body.modepc header.active nav ul.menu_main li ul.sub-menu li a {
  font-size: 1.5rem;}

 /* header.active */
 body.modepc header.active {
  width: 100%;
  height: 100vh;
  background: #373737;
  margin: 0;
  position: fixed;
  z-index: 99;
  overflow: auto;}

 body.modepc header.active .lang {
  text-align: center;
  right: 0;
  margin: 10rem auto 2rem;}

 body.modepc header.active .lang a:first-child {
  padding-left: 0;}

 body.modepc header.active h1 {
  display: none;}

 body.modepc header.active .lang,
 body.modepc header.active nav {
  display: block;
  position: relative;
  flex-basis: 100%;
  margin: 5rem auto -5rem;}

 body.modepc header.active .lang {
  top: 0;
  margin-top: 4em;
  margin-bottom: 2rem;}

 body.modepc header.active nav ul.menu_main {
  display: block;}

 body.modepc header.active nav ul.menu_main:last-child {
  margin-top: 0;}

 body.modepc header.active nav ul.menu_main li:hover ul.sub-menu {
  display: none;}

 body.modepc header.active nav ul.menu_main li ul.sub-menu {
  position: relative;}

 body.modepc header.active nav ul.menu_main li:nth-child(2) ul.sub-menu,
 body.modepc header.active nav ul.menu_main li:nth-child(3) ul.sub-menu {
  width: 100%;}

 body.modepc header.active nav ul.menu_main li a {
  color: #fff;}

 /* hamburger btn */
 body.modepc .hamburger,
 body.modepc .hamburger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;}

 body.modepc .hamburger {
  position: fixed;
  width: 2.5rem;
  height: 1.4rem;
  cursor: pointer;
  top: 3.5rem;
  right: 2rem;
  z-index: 100;}

 body.modepc .hamburger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.2rem;
  background-color: #803F3F;}

 body.modepc .hamburger span:nth-of-type(1) {
  top: 0;}

 body.modepc .hamburger span:nth-of-type(2) {
  top: 50%;
  transform: translateY(-50%);}

 body.modepc .hamburger span:nth-of-type(3) {
  bottom: 0;}

 body.modepc .hamburger.active span:nth-of-type(1) {
  transform: translateY(5px) rotate(-45deg);}

 body.modepc .hamburger.active span:nth-of-type(2) {
  opacity: 0;}

 body.modepc .hamburger.active span:nth-of-type(3) {
  transform: translateY(-7px) rotate(45deg);}
}

@media (max-width: 640px) {
 header .header_wrap {
  margin: 1rem auto;
  display: block;}

 header h1 {
  margin: auto;
  width: 8.2rem;}

 /*  */
 header .lang,
 header nav {
  display: none;
  position: absolute;}

 header.active nav ul.menu_main > li {
  border-bottom: 1px solid #fff;
  width: 100%;
  position: relative;}

 header nav ul.menu_main > li:not(.nounder)::after {
  content: none;}

 header nav ul.menu_main > li:not(.nounder)::before {
  content: url('../img/btn_allow_white.svg');
  position: absolute;
  right: 10%;
  top: 1rem;
  transform: rotate(90deg);}

 header nav ul.menu_main > li.open:not(.nounder)::before {
  transform: rotate(-90deg);}

 header.active nav ul.menu_main > li a {
  width: 100%;
  padding: 0.5em 0;
  background: none;}

 header.active nav ul.menu_main li ul.sub-menu {
  max-width: 100%;
  width: 100%;}

 header.active nav ul.menu_main li ul.sub-menu li {
  background: #404040;}

 header.active nav ul.menu_main li ul.sub-menu li a {
  font-size: 1.5rem;}

 /* header.active */
 header.active {
  width: 100%;
  height: 100vh;
  background: #373737;
  margin: 0;
  position: fixed;
  z-index: 99;
  overflow: auto;}

 header.active .lang {
  text-align: center;
  right: 0;
  margin: 10rem auto 2rem;}

 header.active .lang a:first-child {
  padding-left: 0;}

 header.active h1 {
  display: none;}

 header.active .lang,
 header.active nav {
  display: block;
  position: relative;
  flex-basis: 100%;
  margin: 5rem auto -5rem;}

 header.active .lang {
  top: 0;
  margin-top: 4em;
  margin-bottom: 2rem;}

 header.active nav ul.menu_main {
  display: block;}

 header.active nav ul.menu_main:last-child {
  margin-top: 0;}

 header.active nav ul.menu_main li:hover ul.sub-menu {
  display: none;}

 header.active nav ul.menu_main li ul.sub-menu {
  position: relative;}

 header.active nav ul.menu_main li:nth-child(2) ul.sub-menu,
 header.active nav ul.menu_main li:nth-child(3) ul.sub-menu {
  width: 100%;}

 header.active nav ul.menu_main li a {
  color: #fff;}

 /* hamburger btn */
 .hamburger,
 .hamburger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;}

 .hamburger {
  position: fixed;
  width: 2.5rem;
  height: 1.4rem;
  cursor: pointer;
  top: 3.5rem;
  right: 2rem;
  z-index: 100;}

 .hamburger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.2rem;
  background-color: #803F3F;}

 .hamburger span:nth-of-type(1) {
  top: 0;}

 .hamburger span:nth-of-type(2) {
  top: 50%;
  transform: translateY(-50%);}

 .hamburger span:nth-of-type(3) {
  bottom: 0;}

 .hamburger.active span:nth-of-type(1) {
  transform: translateY(5px) rotate(-45deg);}

 .hamburger.active span:nth-of-type(2) {
  opacity: 0;}

 .hamburger.active span:nth-of-type(3) {
  transform: translateY(-7px) rotate(45deg);}
}


footer {
 background: #373737;
 color: #fff;
 padding: 7rem 0 4rem;}

footer a {
 color: #fff;}

footer .footer_wrap {
 max-width: 125.6rem;
 margin: auto;}

footer .menu_main {
 border-bottom: 1px solid #727272;
 margin: 0 0 3rem;
 padding: 0 0 3rem;}

footer .menu_main nav {
 flex-basis: 80%;}

footer .menu_main nav > ul > li {
 letter-spacing: 0.3em;}

footer .menu_main nav a {
 font-size: 1.7rem;
 font-weight: 400;}

footer .sub-menu {
 margin: 0 0 11.4rem;}

footer .sub-menu ul {
 display: flex;
 flex-flow: column wrap;
 height: 12rem;
 line-height: 2.5;}

footer .sub-menu ul a {
 font-size: 1.4rem;
 letter-spacing: 0.1em;}

footer .address {
 display: flex;
 align-items: center;
 margin: 0 auto 6rem;
 max-width: 60rem;}

footer .address figure {
 padding: 0 3.9rem 0 0;}

footer .address p {
 border-left: 1px solid #5E5E5E;
 font-size: 1.4rem;
 padding: 0 0 0 3.5rem;
 letter-spacing: 0.18em;}

footer .address p span {
 display: block;
 font-size: 1.5rem;
 margin: 0 0 1rem;
 letter-spacing: 0.3em;}

footer .sns {
 margin: 0 5% 3rem;
 text-align: center;}

footer .sns a {
 margin: 0 1rem;}

 footer .sns a img{
 max-width:22px;}

footer .copy {
 margin: 0 5% ;
 color: #848484;
 font-size: 1.2rem;
 text-align: center;
 letter-spacing: 0.1em;}

@media (max-width: 1300px) {
 body.modepc footer {
  padding: 2rem 0 4.5rem;}

 footer .footer_wrap {
  margin: 0 5%;}

 body.modepc footer .menu_main {
  display: block;}

 body.modepc footer .menu_main nav {
  margin: 0;}

 body.modepc footer .menu_main nav ul {
  flex-wrap: wrap;}

 body.modepc footer .menu_main nav ul li {
  flex-basis: 33%;}

 body.modepc footer .menu_main nav ul li a {
  font-size: 14px;}

 body.modepc footer .sub-menu {
  margin: 0 auto 30px;}

 body.modepc footer .sub-menu ul {
  height: auto;
  flex-flow: wrap;}

 body.modepc footer .sub-menu li {
  flex-basis: 48%;}

 body.modepc footer .address {
  margin: 0 auto 3rem;}

 body.modepc footer .address p {
  padding: 0 0 0 1.5rem;}

 body.modepc footer .address p span {
  display: none;}

 body.modepc footer .address figure {
  padding: 0 2rem 0 0;}

 body.modepc footer .lang {
  text-align: right;
  margin: -2.5rem 9% 0 0;}

 body.modepc.en footer .lang,
 body.modepc.cn footer .lang {
  margin: 0 9% 0 0;}
}

@media (max-width: 640px) {
 footer {
  padding: 3.3rem 0 4.5rem;}

 footer .footer_wrap {
  margin: 0 5%;}

 footer .menu_main {
  display: block;}

 footer .menu_main nav {
  margin: 0;}

 footer .menu_main nav ul {
  flex-wrap: wrap;}

 footer .menu_main nav ul li {
  flex-basis: 33%;}

 footer .menu_main nav ul li a {
  font-size: 14px;}

 footer .sub-menu {
  margin: 0 auto 30px;}

 footer .sub-menu ul {
  height: auto;
  flex-flow: wrap;}

 footer .sub-menu li {
  flex-basis: 48%;}

 footer .address {
  margin: 0 auto 3rem;}

 footer .address p {
  padding: 0 0 0 1.5rem;}

 footer .address p span {
  display: none;}

 footer .address figure {
  padding: 0 2rem 0 0;}

 footer .lang {
  text-align: right;
  margin: -2.5rem 9% 0 0;}

 .en footer .lang,
 .cn footer .lang {
  margin: 0 9% 0 0;}
}

@media (max-width: 900px) {
 .under .content .wrap {
  /*margin:0 5% ;*/}

 body.modepc.under .content .wrap {
  margin: 0 5%;}

 body.modepc footer .menu_main nav ul li {
  flex-basis: 45%;}

 body.modepc.under .content .wrap {
  margin-bottom: 8rem;}

 body.modepc.under .content .col2 .wrap {
  margin-bottom: 0;}
}

@media (max-width: 640px) {
 .under .content .wrap {
  margin: 0 5%;}

 footer .menu_main nav ul li {
  flex-basis: 45%;}

 .under .content .wrap {
  margin-bottom: 8rem;}

 .under .content .col2 .wrap {
  margin-bottom: 0;}
}

@media (max-width: 700px) {
 body.modepc footer .sub-menu li {
  flex-basis: 100%;}

 body.modepc footer .address {
  margin: 0 5% ;
  flex-wrap: wrap;
  align-items: center;}

 body.modepc footer .address figure {
  text-align: center;
  margin: 0 auto 20px auto;
  padding: 0;
  flex-basis: 100%;}

 body.modepc footer .address p {
  border-left: none;
  padding: 0;
  text-align: center;
  flex-basis: 100%;}
}

@media (max-width: 640px) {
 footer .sub-menu li {
  flex-basis: 100%;}

 footer .address {
  margin: 0 5% ;
  flex-wrap: wrap;
  align-items: center;}

 footer .address figure {
  text-align: center;
  margin: 0 auto 20px auto;
  padding: 0;
  flex-basis: 100%;}

 footer .address p {
  border-left: none;
  padding: 0;
  text-align: center;
  flex-basis: 100%;}
}

@media (max-width: 600px) {
 .btn a {
  display: block;
  width: 100%;
  margin: 0 0 1rem;
  padding: .5rem;}

 footer .menu_main {
  margin: 0 0 1rem;
  padding: 0 0 1rem;}

 footer .sub-menu ul {
  line-height: 1.6;}

 .lang a {
  font-size: 1.3rem}
}