@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=EB+Garamond&family=Noto+Serif+JP:wght@400;500&family=Noto+Sans+JP:wght@400;500&display=swap');

/* ------- Reset ------- */
html{font-size: 62.5%; overflow-x: hidden; }
body{line-height: 1.7; word-spacing: 0; font-size: 1.4rem; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -moz-text-size-adjust: 100%; font-family: 'Noto Serif JP', serif;}

*{margin: 0; padding: 0; box-sizing: border-box; border: 0;}
h1, h2, h3, h4, h5, h6{font-size: 100%; font-weight: normal;}
ol, ul{list-style: none;}
table{border-collapse: collapse; border-spacing: 0;}
th{text-align: left; font-weight: normal;}
a{color: inherit; text-decoration: none;}
img{vertical-align: bottom; max-width: 100%;}
a[href^="tel:"]{pointer-events: none;}

/*
#wrapper{background: #000; color: #fff;}
*/

.toppage #wrapper{background-image:url("../img/common/bg-clay.jpg"); background-repeat: no-repeat; background-size: contain; background-position: top; background-color:#fff; color: #000; }

header { color: #000; }

.container{margin: 0 auto; max-width: 1000px; width: 90%;}
.pageContents.max800{margin-right: auto; margin-left: auto; max-width: 800px; }

.bkg-beige { background-color: #f3f2e6; padding: 20px 60px; }
.bkg-white { background-color: #fff; padding: 40px; }

.bkg-content {
  background-image:url("../img/common/bg-clay.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top;
}

.container.nomargin { margin-top: -144px; }
.clearFix:after{display: block; clear: both; height: 0; visibility: hidden; content: ".";}

.cap,
[class*="cap-"]{font-size: 1rem; line-height: 1.4;}
.cap-abs_right{position: absolute; bottom: 7px; right: 7px; text-align: right;}
.cap-abs_left{position: absolute; bottom: 7px; left: 7px;}
.cap-right{padding-top: 3px;}
.cap-left{padding-top: 3px;}
.shadow{color: #fff; text-shadow: 0 0 1px rgba(0,0,0,.8), 0 0 2px rgba(0,0,0,.8), 0 0 3px rgba(0,0,0,.8), 0 0 4px rgba(0,0,0,.8), 0 0 5px rgba(0,0,0,.8), 0 0 6px rgba(0,0,0,.8), 0 0 7px rgba(0,0,0,.8), 0 0 8px rgba(0,0,0,.8), 0 0 9px rgba(0,0,0,.8), 0 0 10px rgba(0,0,0,.8);}
.cap-big{font-size: 1.2rem;}

.center{text-align: center !important;}
.left{text-align: left !important;}
.right{text-align: right !important;}
.bold{font-weight: bold;}
.txtFlip{text-align: right; -webkit-transform: rotateY(180deg); transform: rotateY(180deg);}
.fontEB{
	font-family: 'EB Garamond', serif;
	color: black;
}
.font-small { font-size: 11px; }
.sans-serif { font-family: 'Noto Sans JP', sans-serif; }

.color-gray1 { color: #c8c8c8; }

.mt-5 { margin-top: 5px; }
.mt-10 { margin-top: 10px; }
.mt-20 { margin-top: 20px; }
.mt-30 { margin-top: 30px; }
.mt-40 { margin-top: 40px; }
.mt-50 { margin-top: 50px; }
.mt-60 { margin-top: 60px; }
.mt-70 { margin-top: 70px; }
.mt-80 { margin-top: 80px; }
.mt-90 { margin-top: 90px; }
.mt-100 { margin-top: 100px; }

.mb-10 { margin-bottom: 10px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-30 { margin-bottom: 30px !important; }
.mb-40 { margin-bottom: 40px !important; }
.mb-50 { margin-bottom: 50px !important; }

.max80per { max-width: 80%; }

.text-center { text-align: center; }
.text-right { text-align: right; }

.nolink { pointer-events:none !important; cursor:default !important; }
.nolink.ghost { opacity:.5 !important; }
.nolink::after { content: none !important; }

.title-type1 {
  background-color: #5e452c;
  color: #fff;
  text-align: center;
  padding: 35px 20px;
  font-size: 26px;
}

.row {
  padding-top: 65px;
  padding-bottom: 45px;
}
.bg-black {
  background-color: #000;
}
.bg-black p {
  color: #fff;
}
.bg-clay {
  background-image: url(../img/common/bg-clay.jpg);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.bg-clay-r::before {
  content: "";
  background-image: url(../img/common/bg-clay-r.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  min-height: 880px;
  position: absolute;
  z-index: 0;
}
.slick-dots li button:before {
  border-radius: 10px;
  background-color: #fff;
}
.slick-dots li.slick-active button:before {
  background-color: #c9a063;
}
.slick-dots {
  bottom: 35px;
}
#subnav li#nav-b1.nolink {
  background-image: url(../img/plan/btn_b1.jpg) !important;
}
.hover50:hover { transition: opacity .5s;}

.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.obi-green {
  background-color: #5fc0bd;
  color: #fff;
  font-size: 36px;
  text-align: center;
  padding: 5px 0;
  letter-spacing: 1px;
}
.font-10 { font-size: 10px !important; }
.font-11 { font-size: 11px !important; }
.font-12 { font-size: 12px !important; }
.font-13 { font-size: 13px !important; }
.font-14 { font-size: 14px !important; }
.font-15 { font-size: 15px !important; }
.font-16 { font-size: 16px !important; }
.font-17 { font-size: 17px !important; }
.font-18 { font-size: 18px !important; }
.font-19 { font-size: 19px !important; }
.font-20 { font-size: 20px !important; }
.font-21 { font-size: 21px !important; }
.font-22 { font-size: 22px !important; }
.font-23 { font-size: 23px !important; }
.font-24 { font-size: 24px !important; }

.line-10 { line-height: 1.0;}
.line-11 { line-height: 1.1;}
.line-12 { line-height: 1.2;}
.line-13 { line-height: 1.3;}
.line-14 { line-height: 1.4;}

.wrapper-specialbnr {
  padding: 26px;
  position: relative;
}
.specialbnr1 a {
  background-repeat: no-repeat;
  background-size: 1280px 560px;
  background-position: center;
  height: 560px;
  display: block;
  text-indent: -9999px;
}
.specialbnr2,
.specialbnr4 > div,
.specialbnr5 > div,
.specialbnr6 > div,
.specialbnr7 > div,
.specialbnr8 > div,
.specialbnr9 > div,
.specialbnr10 > div {
  margin-top: 26px;
}
.specialbnr3 > div,
.specialbnr4 > div,
.specialbnr5 > div,
.specialbnr6 > div,
.specialbnr7 > div,
.specialbnr8 > div,
.specialbnr9 > div,
.specialbnr10 > div {
  padding-right: 13px;
}
.specialbnr5 > div + div,
.specialbnr7 > div + div {
  padding-left: 13px;
}
.specialbnr3 > div + div,
.specialbnr4 > div + div,
.specialbnr5 > div + div + div,
.specialbnr6 > div + div,
.specialbnr7 > div + div + div,
.specialbnr8 > div + div,
.specialbnr9 > div + div,
.specialbnr10 > div + div {
  padding-right: 0;
  padding-left: 13px;
}

.specialbnr3 > div > p {
  padding-top: 26px;
}
.specialbnr2 a,
.specialbnr3,
.specialbnr4,
.specialbnr5,
.specialbnr6,
.specialbnr7,
.specialbnr8,
.specialbnr9,
.specialbnr10 {
  display: flex;
}


.col2img img {
  width: 50%;
}

.col2-2 a {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
}
.col2-2.green {
  background-color: #335115;
}
.col2-2 h5 {
  width: 184px;
}
.col2-2 h5 strong {
  display: inline-block !important;
  border-top: 1px solid #fff;
  margin-top: 10px;
  padding-top: 7px;
}
.col2-2 h5 + img { 
  width: calc(100% - 184px);
}
.col4,
.col5 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap
}
.col4 > div {
  width: calc(25% - 15px);
}
.col5 > div {
  width: calc(20% - 15px);
}
.col2-2 .tit-type1,
.col4 .tit-type1,
.col5 .tit-type1 {
  font-size: 12px;
  line-height: 1.4;
  padding: 10px 0;
}
.col2-2 .tit-type1 strong,
.col4 .tit-type1 strong,
.col5 .tit-type1 strong {
  display: block;
  font-size: 15px;
}

.btn-details {
  width: 100%;
  max-width: 422px;
  display: inline-block;
  border: 2px solid #000;
  padding: 6px;
}
.btn-type1 {
  text-align: center;
  margin-top: 30px;
}
.btn-type1 a {
  display: inline-block;
  border: 1px solid #000;
  border-radius: 30px;
  padding: 10px 20px;
}
.btn-type2 {
  width: 100%;
  margin-top: 30px;
}
.btn-type2 a {
  display: inline-block;
  border: 1px solid #000;
  border-radius: 5px;
  padding: 10px 20px;
  text-align: center;
  max-width: 348px;
  width: 100%;
}

.mainArea .l-inner.-narrow {
  max-width: 1000px
}
.l-inner {
  max-width: 1080px;
  margin-right: auto;
  margin-left: auto;
}
#main-cap{color: #000; padding: 20px 0 40px; font-size: 1rem; max-width: 1000px; margin-right: auto; margin-left: auto; text-align: left;}
#main-cap2{color: #000; padding: 20px 0 40px; font-size: 1rem; max-width: 1140px; margin-right: auto; margin-left: auto; text-align: left;}

.icon-sns {
  text-align: center;
  margin-top: 40px;
}
#footer-contact + .icon-sns {
  margin-top: 0;
  margin-bottom: 40px;
}
.icon-sns li {
  display: inline-block;
  margin-right: 10px;
  margin-left: 10px;
}
.icon-sns li a {
  font-size: 2em;
}

@media only screen and (min-width: 1280px) { 
  .specialbnr1 a {
    background-position: center;
    background-size: cover;
    width: 100%;
    height: auto;
  }
  .specialbnr1 a::after {
    content: '';
    display: block;
    padding-top: 43.75%;
  }
}

.specialbnr1 a {
  background-image: url("../img/top/bnr-special1.jpg");
}

@media screen and (max-width: 767px) {
  .l-inner {
    max-width: 100%;
    padding-right: 5%;
    padding-left: 5%;
  }
  .title-type1 {
    padding: 15px 10px;
    font-size: 20px;
    line-height: 1.4;
  }
}
@media(min-width: 701px) {
  .section-commonArea .commonAreaItems {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
  }
}
@media(min-width: 701px) {
  .section-commonArea .commonAreaItems .commonAreaItem {
    width: 48%;
    margin-bottom: 4%
  }
  .section-commonArea .commonAreaItems .commonAreaItem2 {
    width: 260px;
    margin-bottom: 4%;
  }
  .section-commonArea .commonAreaItems .commonAreaItem2 + .commonAreaItem2 {
    width: calc(100% - 260px);
  }
}
@media(max-width: 700px) {
  .section-commonArea .commonAreaItems .commonAreaItem {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 20px
  }
}
.section-commonArea .name {
  margin: 1em 0 .5em;
  font-size: 16px
}
.section-commonArea .commonAreaItems .commonAreaItem2 .name {
  margin: 0 0 .5em;
}

.section-commonArea .text {
  font-size: 13px
}
  
.oudograde { 
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e4e5d6+0,fafbf2+50,e4e5d6+100 */
  background: #e4e5d6; /* Old browsers */
  background: -moz-linear-gradient(left,  #e4e5d6 0%, #fafbf2 50%, #e4e5d6 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left,  #e4e5d6 0%,#fafbf2 50%,#e4e5d6 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right,  #e4e5d6 0%,#fafbf2 50%,#e4e5d6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4e5d6', endColorstr='#e4e5d6',GradientType=1 ); /* IE6-9 */
  padding: 60px 0;
}

.shinymethod { position: relative; overflow: hidden; }
.shinymethod:after{ content: ""; position: absolute; top: 0; left: 0; z-index: 1; width: 200%; height: 200%;
background-image: linear-gradient(-130deg, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 80%);
transform: translate3d(-100%, 0, 0); -webkit-animation: shinyBtn 4s linear infinite; animation: shinyBtn 4s linear infinite;}

/*
.slick-list {
  overflow: visible;
}
*/
.slider {
  margin-top: 20px;
  margin-right: -145px;
  margin-left: -145px;
  margin-bottom: 20px;
}
.slider .wow {
  margin-right: 10px;
  margin-left: 10px;
}
.slider .slidertitle {
  position: relative;
  color: #000;
  background-color: rgba(255,255,255,.85);
  padding: 10px 20px;
  width: 100%;
  max-width: 230px;
  text-align: center;
  margin-top: -37px;
  margin-right: auto;
  margin-left: auto;
  font-size: 2rem;
}
.slidertitle span  {
  display: block;
  font-size: 1.2rem;
}

.spDisp{display: none;}

@media only screen and (min-width: 768px){
    .sp{display: none !important;}
}

@media only screen and (max-width: 767px){
    a[href^="tel:"]{pointer-events: auto;}    
    .pc{display: none !important;}
    .text-left_sp { text-align:left; }

    .mt-5_sp { margin-top: 5px !important; }
    .mt-10_sp { margin-top: 10px !important; }
    .mt-20_sp { margin-top: 20px !important; }
    .mt-30_sp { margin-top: 30px !important; }
    .mt-40_sp { margin-top: 40px !important; }
    .mt-50_sp { margin-top: 50px !important; }
    .mt-60_sp { margin-top: 60px !important; }
    .mt-70_sp { margin-top: 70px !important; }
    .mt-80_sp { margin-top: 80px !important; }
    .mt-90_sp { margin-top: 90px !important; }
    .mt-100_sp { margin-top: 100px !important; }

    .font-15 { font-size: 13px !important; }
    .font-16 { font-size: 14px !important; }
    .font-17 { font-size: 15px !important; }
    .font-18 { font-size: 16px !important; }
    .font-19 { font-size: 17px !important; }
    .font-20 { font-size: 18px !important; }

    .specialbnr2 a,
    .specialbnr3,
    .specialbnr4,
    .specialbnr6,
    .specialbnr8,
    .specialbnr9,
    .specialbnr10 {
      display: block;
    }
    .specialbnr5,
    .specialbnr7 {
      flex-wrap:wrap;
    }
    .specialbnr5 > div + div,
    .specialbnr7 > div {
      width: calc(50% - 5px);
      margin-right: 5px;
    }
    .specialbnr5 > div + div + div,
    .specialbnr7 > div + div {
      margin-left: 5px;
      margin-right: 0;
    }
    .specialbnr7 > div + div + div {
      width: 100%;
      margin-left: 0;
      margin-right: 0;
    }


    .specialbnr2,
    .specialbnr4 > div,
    .specialbnr5 > div,
    .specialbnr6 > div,
    .specialbnr7 > div,
    .specialbnr8 > div,
    .specialbnr9 > div,
    .specialbnr10 > div {
      margin-top: 10px;
    }
    .specialbnr3 > div > p {
      padding-top: 10px;
    }


    .specialbnr3 > div,
    .specialbnr4 > div,
    .specialbnr5 > div,
    .specialbnr6 > div,
    .specialbnr7 > div,
    .specialbnr8 > div,
    .specialbnr9 > div,
    .specialbnr10 > div {
      padding-right: 0;
    }
    .specialbnr3 > div + div,
    .specialbnr4 > div + div,
    .specialbnr5 > div + div + div,
    .specialbnr6 > div + div,
    .specialbnr7 > div + div + div,
    .specialbnr8 > div + div,
    .specialbnr9 > div + div,
    .specialbnr10 > div + div,
    .specialbnr5 > div + div,
    .specialbnr7 > div + div {
      padding-left: 0;
    }
  
    #intro-tit,.tit-type0 {
      font-size: 2.4rem !important;
      line-height: 1.4;
    }
}

@media only screen and (min-width: 481px){
    .sp480{display: none;}
}

@media print {
    body{color-adjust: exact; -webkit-print-color-adjust: exact; print-color-adjust: exact;}
}

/* Header */
header{position: fixed; top: 0; left: 0; width: 100%; height: 120px; background: #fff; z-index: 990;}
h1{display: flex; align-items: flex-end; height: 50px; margin-left: 25px;}
h1 a{width: 356px; line-height: 1;}
h1 img{width: 100%;}

#header-btn{position: absolute; top: 0; right: 0; width: 399px; display: flex; justify-content: space-between; text-align: center;}
#header-btn > div { width: 100%; display: flex; justify-content: space-between; }


#header-btn a{width: 49.2%; height: 50px; padding-top: 10px; display: block; color: #fff; line-height: 1; position: relative; overflow: hidden;}

#header-btn a {
	background-image: url(../img/common/bg_request.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}
/*
#header-btn a:nth-of-type(2) {
	background-image: url(../img/common/bg_request.jpg);
	background-repeat: no-repeat;
	background-size: cover;
  padding-top: 7px;
  line-height: 1.3;
}
*/
#header-btn a:nth-of-type(1) {
  background-image: url(../img/common/bg_raijo.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	padding-top: 7px;
  line-height: 1.3;
  color: #fff;
}
#header-btn a:nth-of-type(2) span {
  font-size: 9px;
  display: block;
  padding-top: 5px;
}
#header-btn a.type-enji {
  background-image: url(../img/common/bg_plan.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	color: #fff
}
#header-btn a.type-kon {
  background-image: none;
  background-color: #000;
  padding-top: 10px;
  color: #fff;
}
#header-btn a:hover {
  color: #000 !important;
}

#header-btn a:nth-of-type(3) span{font-size: 9px; display: block; padding-top: 5px;}


/*
#header-btn a:nth-of-type(1){background: #bdbdbe;}
#header-btn a:nth-of-type(2){background: #8c793f;}
#header-btn a:nth-of-type(2), #header-btn a:nth-of-type(4) {display: none;}
*/

#header-btn a:after{content: ""; position: absolute; top: 0; left: 0; z-index: 1; width: 200%; height: 200%;
background-image: linear-gradient(-130deg, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 80%);
transform: translate3d(-100%, 0, 0); -webkit-animation: shinyBtn 4s linear infinite; animation: shinyBtn 4s linear infinite;}

.sectionLeadBox {
  padding: 70px 0;
  text-align: center;
  position: relative;
  z-index: 1;
}
.sectionLeadBox h1.p-lead.-large {
  display: block;
  height: auto;
  line-height: 1.4;
  font-size: 42px;
  letter-spacing: .1em;
  font-family: "EB Garamond", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
.sectionLeadBox h1 span {
  display: block;
  font-size: 16px;
  letter-spacing: 0;
}

.wrapper-specialbnr a:hover {
  opacity: .8;
}
.opacity07 a:hover {
  opacity: .7;
}
.kirakira a {
  position: relative;
  overflow: hidden;
  display: inline-block;
}
.kirakira a:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 200%;
  height: 200%;
  background-image: linear-gradient(-130deg, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 80%);
  transform: translate3d(-100%, 0, 0); -webkit-animation: shinyBtn 4s linear infinite; animation: shinyBtn 4s linear infinite;
}

@-webkit-keyframes shinyBtn {
    0% {transform:translate3d(-100%, 0, 0);}
    30% {transform:translate3d(100%, 0, 0);}
    100% {transform:translate3d(100%, 0, 0);}
}
@keyframes shinyBtn {
    0% {transform:translate3d(-100%, 0, 0);}
    30% {transform:translate3d(100%, 0, 0);}
    100% {transform:translate3d(100%, 0, 0);}
}

#header-nav{position: absolute; top: 0; right: 400px; display: flex; align-items: flex-end; text-align: center;}
#header-nav a{margin-right: 12px; width: 110px; height: 50px; padding-top: 22px; display: block; position: relative; font-size: 1.2rem; line-height: 1;}
#header-nav a:after{content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; z-index: -1;
background: linear-gradient(90deg, #a7a976 0%, #f0f3d4 50%, #a7a976 100%); transition: height .3s;}
#header-nav a.un{opacity: .5; pointer-events: none;}
#header-nav a.un:after{ pointer-events: none;}

#header-nav a.active{color: #000;}
#header-nav a.active:after{height: 100%;}

#gnav{display: flex; justify-content: space-between; padding: 24px 10px 12px; text-align: center;}
#gnav li{position: relative; flex: 1 0 auto;}
#gnav li:after{content: ''; position: absolute; top: 0; bottom: 0; right: 0; height: 14px; margin: auto; width: 1px; background: #000;}

#gnav li.un a{opacity: .5; pointer-events: none;}
#gnav a{padding: 0; line-height: 1.3; height: 34px; display: flex; align-items: center; justify-content: center; position: relative;}
#gnav li a:after{content: ''; position: absolute; bottom: 0; left: 50%; width: 0; height: 2px; transform: translateX(-50%); -webkit-transform: translateX(-50%); transition: width .3s; background: linear-gradient(90deg, #a7a976 0%, #f0f3d4 50%, #a7a976 100%);}


/* Main */
.main{margin-top: 120px;}
.bgWhite{background: #fff; color: #000;}
#mv{ /*margin-bottom: 70px;*/ position: relative;}
#mv img{width: 100%;}
#mv:before{content: ''; background: #000; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; transition: height .5s;}
#mv.animated:before{height: 0;}

h2.m-tit2{margin: 0 auto 60px; text-align: center; position: relative; font-size: 24px; }
.nomargin h2.m-tit2{ margin: 0 auto 120px; }

h2.m-tit2 span{display: block; padding-top: 10px; line-height: 1.3; }
/*
h2.m-tit2:before{content: ''; background: #000; position: absolute; top: 0; right: 0; width: 100%; height: 100%; transition: width 1.3s;}
*/
h2.m-tit2.animated:before{width: 0;}
h2.m-tit2.big{font-size: 2.8rem; line-height: 1.2; padding-top: 60px;}

h3.m-tit3{font-size: 4rem; line-height: 1.4; text-align: center; margin-bottom: 60px;}
h4.m-tit4{font-size: 2.7rem; line-height: 1.4; text-align: center; color: #7a6a56; margin-bottom: 30px; font-family: 'EB Garamond', serif;}
h5.m-tit5{font-size: 2.1rem; line-height: 1.5; margin-bottom: 20px;}

.main-txt{
	font-size: 1.5rem;
	line-height: 1.8;
	margin-bottom: 80px;
	text-align: center;
}
.main-txt2{line-height: 2;}
.flexBetween{display: flex; justify-content: space-between; flex-wrap: wrap;}

.sub-cap { font-size: 1rem; }

.meritBlock {
  padding: 20px 0;
}

.meritBlock .strongMerit {
  margin: 20px 0 30px;
  text-align: center
}

.meritBlock .strongMerit span {
  display: inline-block;
  padding: 10px 20px 15px;
  border-bottom: 1px dashed #aaa
}

.meritBlock .merits {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

@media(max-width: 700px) {

  .row {
    padding-top: 35px;
    padding-bottom: 25px;
  }
  
  .meritBlock {
    padding: 0;
  }
  
  .meritBlock .merits {
    flex-direction: column
  }
  #main-cap {
    text-align: left;
  }
}

.meritBlock .merit {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  font-size: 14px;
  line-height: 1.3;
  text-align: center;
}

.meritBlock .merit a:hover {
  opacity: .5;
} 

.topic-row-1 + .meritBlock + .meritBlock {
  margin-top: 30px;
}

.topic-row-1 + .meritBlock + .meritBlock .merit {
  background-image: url("../img/top/bkg-btn-merit.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  border: none !important;
}
/*
.meritBlock .merit + .merit {
  width: 33%;
}
.meritBlock .merit + .merit + .merit {
  width: 38%;
}
.meritBlock .merit + .merit + .merit + .merit {
  width: 23%;
}
.meritBlock .merit + .merit + .merit + .merit + .merit {
  width: 43%;
}
*/
.meritBlock .merit50 {
  width: 50% !important;
}

.meritBlock .merit strong {
  font-size: 20px;
  display: block;
}
.meritBlock .merit small {
  font-size: 10px;
  font-weight: normal;
  letter-spacing: -.1em;
  padding-top: 2px;
}

@media(min-width: 701px) {
  .meritBlock .merit {
    width: 33%;
    padding: 10px 40px;
  }
  .meritBlock .merit:first-child {
    border-right: 1px solid #634b3b;
  }

  /*
  .meritBlock .merit {
    width: 28%;
    height: 80px;
    border-right: 1px solid #ccc
  }
  */
}

@media(max-width: 700px) {
  .meritBlock .merit {
    width: 100% !important;
    height: auto;
    min-height: 70px;
    padding: 30px 20px;
  }
  .meritBlock .merit:first-child {
    border-bottom: 1px solid #634b3b;
  }
  .meritBlock .l-inner {
    padding-right: 0;
    padding-left: 0;
  }
  
}

.meritBlock .adMessage {
  margin-top: 1em;
  padding: .75em;
  background: #573f19;
  text-align: center;
  font-size: 24px;
  letter-spacing: .1em;
  color: #fff
}

.meritBlock .adMessage:before {
  opacity: .25
}

@media(max-width: 700px) {
  .meritBlock .adMessage {
    font-size: 14px
  }
}
#intro-tit{font-size: 2.8rem;}
.sectionLeadBox #intro-tit {
  font-size: 2.2rem;
}

#intro-tit:after{content: ''; background-image: url("../img/common/ic_yajiri.png"); background-repeat: no-repeat; background-size: contain; width: 100%; max-width: 842px; height: 4px; margin: 25px auto; display: block;}

#intro-tit.noborder { margin-bottom: 30px;}
#intro-tit.noborder:after{content:none; }

#intro-tit.single-line::after {
  background: none;
  max-width: 100%;
  margin-top: 10px;
  border-bottom: 1px solid #c79f62;
}

.title-type2 {
  font-size: 24px;
  line-height: 1.4;
  border-top: 1px solid #c79f62;
  position: relative;
  padding-top: 40px;
  margin-bottom: 40px;
}
.title-type2::before,
.title-type2::after {
  content: "";
  background-color: #c79f62;
  width: 1px;
  height: 97px;
  position: absolute;
  top: 0;
}
.title-type2::before {
  left: 0;
}
.title-type2::after {
  right: 0;
}
.title-type3 {
  background-image: url("../img/common/bkg-obi_01.png");
  color: #fff;
  text-align: center;
  padding: 18px;
  font-size: 20px;
}
.tit-type0 {font-size: 2.8rem;}

.tit-type1 {
  background-color: #000;
  color: #fff;
  font-size: 20px;
  text-align: center;
  padding: 5px;
}
.tit-type1.green {
  background-color: #335115;
}
.tit-type2 {
  font-size: 20px;
  text-align: center;
}
.tit-type3 {
  font-size: 17px;
}
.tit-type4 {
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#bdbdbe+0,ffffff+50,bdbdbe+100 */
  background: #bdbdbe; /* Old browsers */
  background: -moz-linear-gradient(left,  #bdbdbe 0%, #ffffff 50%, #bdbdbe 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left,  #bdbdbe 0%,#ffffff 50%,#bdbdbe 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right,  #bdbdbe 0%,#ffffff 50%,#bdbdbe 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bdbdbe', endColorstr='#bdbdbe',GradientType=1 ); /* IE6-9 */
  font-size: 20px;
  text-align: center;
  padding: 20px 5px;
}
.tit-type5 {
  font-size: 20px;
  border-left: 3px solid #a02238;
  padding: 5px 5px 5px 12px;
}
.tit-type6 {
  text-align: center;
  border-top: 1px solid #335115;
  border-right: 1px solid #335115;
  border-left: 1px solid #335115;
}
.tit-type6 h4 {
  margin-top: -20px;
}

.whiteboard {
  background-color: #fff;
  border-top: 1px solid #000;
  padding: 40px 50px;
}
.grafarea ul {
  float: left;
  width: calc(100% - 357px);
}
.grafarea ul + p {
  float: right;
  width: 317px;
}
.grafarea li {
  border-bottom: 1px solid;
  font-size: 17px;
  letter-spacing: -0.1em;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  line-height: 1.2;
}
.grafarea li:nth-child(1) { border-color: #69947b; }
.grafarea li:nth-child(2) { border-color: #b5a063; }
.grafarea li:nth-child(3) { border-color: #c3bd93; }
.grafarea li:nth-child(4) { border-color: #7ea0ac; }
.grafarea li:nth-child(5) { border-color: #5b8695; }

.grafarea li i {
  color: #fff;
  display: inline-block;
  text-align: center;
  padding: 15px 0;
  width: 100%;
  max-width: 50px;
  margin-right: 15px;
  font-style: normal;
}
.grafarea li:nth-child(1) i { background-color: #69947b; }
.grafarea li:nth-child(2) i { background-color: #b5a063; }
.grafarea li:nth-child(3) i { background-color: #c3bd93; }
.grafarea li:nth-child(4) i { background-color: #7ea0ac; }
.grafarea li:nth-child(5) i { background-color: #5b8695; }

.grafarea li i + span {
  width: calc(100% - 65px);
}
#videoheader video {
  display: block;
  position: relative;
  width: 100%;
  height: auto;
  z-index: -1;
}
#videoheader #videoheader_sp {
  display: none;
}
@media only screen and (max-width: 767px) {
  
  #videoheader #videoheader_pc {
    display: none;
  }
  #videoheader #videoheader_sp {
    display: block;
  }
  .col5 > div {
    width: calc(33.3333% - 15px);
    margin-bottom: 20px;
  }
  .col5::after {
    display: block;
    content:"";
    width: calc(33.3333% - 15px);
  }
}

/* Footer */
footer{ background-color: #000; color: #fff; text-align: center; padding: 60px 0 30px; border-top: 1px solid #ccc;}
#footer-contact{font-size: 1.3rem; padding-bottom: 25px;}
#footer-contact li{margin-bottom: 10px;}
#footer-contact a{font-size: 4rem; line-height: 1.1; display: flex; justify-content: center; align-items: center;}
#footer-contact a:before{content: ''; background: url("../img/common/ic_tel.png") no-repeat top left/100% 100%; width: 40px; height: 26px; margin: 8px 8px 0 0;}
#footer-logo{font-size: 1.1rem; margin-bottom: 30px;}
#footer-logo p{margin-bottom: 10px;}
#copyright{font-size: 1.1rem;}


/* Media */
@media only screen and (min-width: 768px){
    #btn-menu{display: none;}
    
    #header-nav a:hover{color: #000;}
    #header-nav a:hover:after{height: 100%;}
    
    #header-btn a:hover{background-image: linear-gradient(to right,#bdbdbe,#f5f5f5,#bdbdbe);}
    #gnav li:last-of-type:after{display: none;}
    #gnav li.active a:after,
    #gnav li a:hover:after{width: 86%;}
  
}
@media only screen and (max-width: 1100px) and (min-width: 768px){
    h1{margin-left: 10px;}
    h1 a{width: 28%; max-width: 310px;}
    #header-btn{width: 228px;}
    #header-btn a{font-size: 10px; padding-top: 12px !important; line-height: 1.3 !important; }
    
    #header-nav{right: 228px;}
    #header-nav a{font-size: 1rem; width: 95px; margin-right: 7px;}
    #gnav li{font-size: 1.25vw;}
}

@media only screen and (max-width: 767px){
	.spDisp{display: block!important;}

    header{height: 50px;}
    h1{align-items: center; margin-left: 10px; position: relative; z-index: 992;}
    h1 a{width: 75%; max-width: 310px;}
    
    #btn-menu{width: 50px; height: 50px; position: absolute; top: 0; right: 0; z-index: 993;}
    #btn-menu span{width: 30px; height: 1px; margin: 25px auto; background: #000; display: block; position: relative;}
    #btn-menu span:before,
    #btn-menu span:after{content: ''; width: 100%; height: 1px; background: #000; display: block; position: absolute; left: 0; transition: transform .3s;}
    #btn-menu span:before{top: -10px;}
    #btn-menu span:after{top: 10px;}
    
    #btn-menu.close span{height: 0;}
    #btn-menu.close span:before{transform: rotate(45deg); -webkit-transform: rotate(45deg); top: 0;}
    #btn-menu.close span:after{transform: rotate(-45deg); -webkit-transform: r#header-btn aotate(-45deg); top: 0;}
    
    #header-wrap{position: fixed; top: 0; bottom: 50px; right: 0; width: 100%; overflow: auto; z-index: -1; pointer-events: none; clip-path: polygon(81.05% 9.1%, 92% 9.1%, 92% 10.1%, 81.05% 10.1%); transition: clip-path 400ms cubic-bezier(0.4, 0, 0.2, 1), background-color 400ms cubic-bezier(0.4, 0, 0.2, 1); padding-top: 50px;}
    #header-wrap.show{background-color: #fff;  z-index: 900; pointer-events: auto; clip-path: polygon(101% -1%, 101% 101%, -1% 101%, -1% -1%);}
    #header-wrap.show #header-nav,
    #header-wrap.show #gnav{opacity: 1;}
           
    
    #header-nav{position: static; justify-content: space-between; flex-wrap: wrap; margin: 20px 0; opacity: 0; transition: opacity 1s .5s;}
    #header-nav a{width: 49%; margin-right: 0;}

    #header-nav a + a + a {
      padding-top: 12px;
    }
    #header-nav a + a + a + a {
      padding-top: 22px;
    }
    
    #header-btn{position: fixed; width: 100%; top: auto; bottom: 0;}
    /*
    #header-btn a{width: 50%;}
    #header-btn a{width: 33.333%; padding-top: 18px;}
    */
    #header-btn a{width: 50%; padding-top: 18px; float: left;}
  
    /*
    #header-btn a:nth-of-type(2), #header-btn a:nth-of-type(4) {display:block;}
    #header-btn a:nth-of-type(1), #header-btn a:nth-of-type(5) {display:none;}
    */
  
    #header-btn a:nth-of-type(1),
    #header-btn a:nth-of-type(2) {
      padding-top: 7px;
      line-height: 1.3;
    }
    
    #gnav{flex-wrap: wrap; padding: 0; justify-content: flex-start; margin-top: 20px; opacity: 0; transition: opacity 1s .5s;}
    #gnav li{width: 50%; flex: none;}
    #gnav li:nth-of-type(2n):after{display: none;}
    #gnav a{height: 50px;}
    #gnav li.active a{color: #000;}
    #gnav li.active a:after{height: 100%; z-index: -1; width: 100%;}
    
    .main{margin-top: 50px;}
    /*h2.m-tit2{margin-bottom: 40px;}*/
    h2.m-tit2.big{padding-top: 40px;}
    h3.m-tit3{font-size: 2.2rem; margin-bottom: 40px;}
    h3.m-tit3 br{display: none;}
    h4.m-tit4{margin-bottom: 20px;}
    .main-txt{margin-bottom: 50px; /* text-align: left; */ }
    .main-txt br{display: none;}    
    footer{margin-bottom: 50px;}

    .title-type3 {
      background-image: url("../img/common/bkg-obi_01_sp.png");
      margin-right: -20px;
      margin-left: -20px;
      padding-left: 90px;
      font-size: 16px;
      white-space: normal;
      background-size: cover;
    }
    .sectionLeadBox h1.p-lead.-large {
      font-size: 40px !important;
      letter-spacing: .05em !important;
    }
    .main-txt {
      text-align: left;
    }
    .title-type2 {
      font-size: 18px;
      padding: 20px 20px 0;
      margin-bottom: 20px;
    }
    .bkg-beige {
      padding: 5px 20px;
      margin-right: -20px;
      margin-left: -20px;
    }
    .column-w2 .block1 img {
      position: static !important;
      max-width: 100% !important;
      margin-top: 20px !important;
    }
    .column2 {
      display: block;
    }
    .column2 div {
      width: 100% !important;
      margin-top: 30px;
    }
    .column2 div + div {
      margin-left: 0 !important;
    }
  
    .col2img img {
      width: 100%;
    }

    .sectionLeadBox {
      padding: 40px 0 20px;
      text-align: center;
  }
}

.divider-blue {
  border-top: 3px solid #171c61;
}
.divider-blue .topic-row-1 {
  margin-top: 20px;
}
.column4 + .topic-row-1 {
  margin-top: 40px;
}
.column4 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.column2 {
  display: flex;
  flex-wrap: wrap;
}
.column2 div {
  width: calc(50% - 30px);
  margin-top: 30px;
}
.column2 div + div {
  margin-left: 60px;
}
.column4 div {
  width: 22.7%;
  margin-top: 30px;
}

@media screen and (max-width: 767px) {

  .image.max {
    margin-right: -19px;
    margin-left: -19px;
  }
  
  .column3 {
    margin-top: 50px;
    float: left;
    width: 48%;
    margin-right: 4%;
  }
  .column3:nth-child(2n) {
    margin-right: 0;
  }
  .grafarea ul,
  .grafarea ul + p {
    float: none;
    width: 100%;
  }
  .grafarea ul + p {
    text-align: center;
    margin-top: 40px;
  }
  .col2-2 a {
    display: block;
  }
  .col2-2 h5,
  .col2-2 h5 + img { 
    width: 100%;
  }
  .col4 > div {
    margin:0 -19px 6px;
    width: calc(50% - -16px);
  }
  .column4 div {
    width: calc(50% - 8px);
    margin-top: 16px;
  }
  .divider-blue .topic-row-1 {
    margin-bottom: 10px;
  }

}

@media screen and (min-width: 768px) {

  .column3 {
    float: left;
    width: 32%;
    margin-right: 2%
  }
  .noMr {
    margin-right: 0
  }
}

@media screen and (max-width: 480px) {
  .col5 > div {
    width: calc(50% - 5px);
    margin-bottom: 10px;
  }
  .col5::after {
    width: calc(50% - 10px);
  }
}

