@charset "utf-8";
/* CSS Document */

/* ----------------------------------------------------
   reset
---------------------------------------------------- */
* {
  margin: 0;
  padding: 0;
}
html,
body {
  height:100%;
  box-sizing: border-box;
}

ul,
ol,
dl {
  list-style-type: none;
}

img,
a img {
  border: 0;
}

table {
  border-collapse: collapse;
}

textarea {
  font-size:100%;
}

.clear {
  clear: both;
  height: 0;
  visibility: hidden;
  font-size: 1px;
  line-height: 0px;
}

br {
  letter-spacing: 0;
}

option {
  padding: 0 10px 0 0;
}

/* ----------------------------------------------------
  common
 ----------------------------------------------------	*/
body {
  color: #453b36;
  font-family: Sawarabi Mincho, YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  line-height: 1.7;
  font-size: 14px;
  letter-spacing: 0.1em;
}
.contents_wrapper{
  min-width: 1100px;
}
.contents {
  width: 1100px;
  margin: 0 auto;
}

@media (max-width: 1099px) {
  html, body {
    height: 100%;
  }
  .contents_wrapper{
    min-width: 100%;
  }
  .contents {
    width: 92%;
  }
}

a img{
  transition: 0.3s linear;
}
a img:hover {
  opacity: 0.7;
}

a {
  color: #993c42;
  text-decoration: none;
  transition: 0.3s linear;
}
a:hover{
  text-decoration: underline;
}

.btn a{
  display: block;
  width:100%;
  height:100%;
  padding: 13px 10px;
  background: #75645c;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.1em;
  text-decoration: none;
  text-align: center;
  position: relative;
  z-index: 2;
  overflow: hidden;
}
.btn a::before,
.btn a::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.btn a,
.btn a::before,
.btn a::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.btn a:hover{
  background:#453b36;
}
.btn a::after {
  top: -100%;
  left: 0;
  width: 100%;
  height: 100%;
}
.btn a:hover::after {
  top: 0;
  background:#453b36;
}

/* ----------------------------------------------------
  header
 ----------------------------------------------------	*/
header,
header .logo,
header .logo img,
header .gnavi,
header .gnavi li {
  transition: .5s;
}
header {
  position: fixed;
  top: 0;
  width: 100%;
  height: 110px;
  background: rgba(255,255,255,0.8);
  z-index: 3;
}
header .logo {
  margin-top: 31px;
  height: 79px;
}
header .logo img {
  width: 120px;
  height: auto;
}
header .gnavi {
  display: table;
  padding-top: 10px;
  height: 100px;
}
header .contents{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
header .gnavi li {
  display: table-cell;
  vertical-align: middle;
  font-size: 18px;
  letter-spacing: 0.1em;
  line-height: 1;
  padding-left: 46px;
}
#home header .gnavi li {
  padding-left: 56px;
}
header .gnavi li a {
  color: #453b36;
  padding-bottom: 2px;
  border-bottom: 1px solid #fff;
  transition-property: all;
  transition: 0.3s linear;
}
header .gnavi li a:hover {
  text-decoration: none;
  border-bottom: 1px solid #453b36;
}
header .gnavi img{
  width: 24px;
  height: 24px;
}
header .gnavi .btn a {
  padding: 17px 20px !important;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.1em;
}

#home header .gnavi li:nth-child(1) a {
  border-bottom: 1px solid #453b36;
}
#salon header .gnavi li:nth-child(2) a {
  border-bottom: 1px solid #453b36;
}
#menu header .gnavi li:nth-child(3) a {
  border-bottom: 1px solid #453b36;
}
#school header .gnavi li:nth-child(4) a {
  border-bottom: 1px solid #453b36;
}
#staff header .gnavi li:nth-child(5) a {
  border-bottom: 1px solid #453b36;
}
#access header .gnavi li:nth-child(6) a {
  border-bottom: 1px solid #453b36;
}

.contents_wrapper{
  margin-top: 110px;
}

/* header transform widthout mobile */
@media (min-width: 768px) {
  header.transform {
    position: fixed;
    background: rgba(255,255,255,1);
    height: 60px;
    top: -63px;
    z-index: 3;
  }
  header.transform .logo {
    margin-top: 11px;
    height: inherit;
  }
  header.transform .logo img {
    width: 90px;
    height: auto;
  }
  header.transform .gnavi {
    padding-top: 5px;
    height: inherit;
  }
/*  header.transform .gnavi li {
    padding-left: 46px;
  }*/
  header.transform {
    top: 0;
  }
}

@media (max-width: 1099px) {
  header .gnavi li {
    padding-left: 26px !important;
  }
  header .gnavi .btn a {
    letter-spacing: 0;
  }
}

@media (max-width: 949px) {
  header .gnavi li {
    padding-left: 18px !important;
    font-size: 14px;
  }
  header .gnavi .btn a {
    padding: 17px 10px !important;
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  header {
    position: fixed;
    height: 50px;
    top: 0;
    background :#fff;
    z-index: 3;
  }
  header .logo{
    margin-top: 8px;
    height: inherit;
  }
  header .logo img {
    width: 80px;
    height: auto;
  }
  .contents_wrapper{
    margin-top: 50px;
  }
}


/* ----------------------------------------------------
  Home contents mainimg
 ----------------------------------------------------	*/
.mainimg{
  background: #e4dcd8 url("../images/top/mainimg.jpg") center top no-repeat;
  width: 100%;
  height: 620px;
}
.mainimg .contents{
  position: relative;
}
.mainimg p{
  color: #644a44;
  font-size:30px;
  letter-spacing: 0.3em;
}
.mainimg p:first-child{
  position: absolute;
  top:272px;
  right: 0;
}
.mainimg p:last-child{
  position: absolute;
  top:320px;
  right: 38px;
}
.mainimg p span{
  font-size: 36px;
}
.mbr {
  display:none;
}

@media (max-width: 900px) {
  .mainimg{
    background: #e4dcd8 url("../images/top/mainimg.jpg") -500px 0 no-repeat;
  }
  .mainimg p{
    font-size:24px;
    letter-spacing: 0.2em;
  }
  .mainimg p span{
    font-size: 30px;
  }
}

@media (max-width: 767px) {
  .mainimg{
    position: relative;
    background: #e4dcd8 url("../images/top/mainimg_sp.jpg") center top no-repeat;
    background-size: cover;
  }
  .mainimg .contents{
    position:absolute;
    width: 95%;
    left: 5%;
    bottom: 5%;
  }
  .mainimg p{
    font-size:24px;
    letter-spacing: 0.2em;
  }
  .mainimg p:first-child{
    position: static;
    top: 0;
    left: 0;
  }
  .mainimg p:last-child{
    position: static;
  }
  .mainimg p span{
    font-size: inherit;
  }
  .maininfo .contents{
    flex-direction: column;
  }
  .mbr{
    display:block;
  }
}

/* Animation */
.mainimg p {
  -moz-transition: -moz-transform .5s linear;
  -webkit-transition: -webkit-transform .5s linear;
  -o-transition: -o-transform .5s linear;
  -ms-transition: -ms-transform .5s linear;
  transition: transform .5s linear;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;

  -webkit-animation-name: imageBlur;
  animation-name: imageBlur;
  opacity: 1;
}
.mainimg p:first-child {
  -webkit-animation-delay: .5s;
  animation-delay: .5s;
}
.mainimg p:last-child {
  -webkit-animation-delay: .7s;
  animation-delay: .7s;
}
@-webkit-keyframes imageBlur {
  from {
    opacity: 0;
    -webkit-filter: blur(150px);
    -moz-filter: blur(150px);
    -ms-filter: blur(150px);
    -o-filter: blur(150px);
    filter: blur(150px);
  }

  to {
    opacity: 1;
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -ms-filter: blur(0px);
    -o-filter: blur(0px);
    filter: blur(0px);
  }
}
@keyframes imageBlur {
  from {
    opacity: 0;
    -webkit-filter: blur(150px);
    -moz-filter: blur(150px);
    -ms-filter: blur(150px);
    -o-filter: blur(150px);
    filter: blur(150px);
  }

  to {
    opacity: 1;
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -ms-filter: blur(0px);
    -o-filter: blur(0px);
    filter: blur(0px);
  }
}

/* ----------------------------------------------------
  Home contents maininfo
 ----------------------------------------------------	*/
.maininfo {
  padding: 36px 0 30px;
  background: #f6f3f3;
}
.maininfo .contents {
  display: flex;
  justify-content: space-between;
}
.maininfo .contents div{
  text-align: center;
}
.maininfo_c{
  margin: 0 10px;
}
.maininfo_r{
  margin-top: 10px;
}
.maininfo_r .btn{
  width: 248px;
  margin: 0 auto;
}
.maininfo_l h1{
  margin-bottom: 5px;
  font-size: 22px;
  font-weight: normal;
  letter-spacing:  0.1em;
}
.maininfo_l h1 + p {
  letter-spacing:  0.2em;
}
.info_text{
  letter-spacing: 0.2em;
}
.tel{
  display: inline-block;
  margin-right: 10px;
  padding-left: 24px;
  background: url("../images/top/icon_tel.png") 0px 13px no-repeat;
  background-size: 13px;
  font-size:30px;
  letter-spacing: 0.1em;
}
.tel a {color:#453b36;}
.mail{
  display: inline-block;
  padding-left: 21px;
  background: url("../images/top/icon_mail.png") 0 4px no-repeat;
  background-size: 14px;
  font-size:12px;
  letter-spacing: 0.1em;
}
.mail a{
  color:#453b36;
  text-decoration: none;
}
@media (max-width: 1099px) {
  .info_text{
    letter-spacing: 0.1em;
  }
}
@media (max-width: 819px) {
  .maininfo_r .btn {
      width: 200px;
  }
  .info_text{
    letter-spacing: 0;
  }
}
@media (max-width: 767px) {
  .maininfo {
    padding: 26px 0 ;
  }
  .maininfo div{
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  .maininfo_l {order: 1;}
  .maininfo_c {order: 3;}
  .maininfo_r {order: 2; margin: 20px 0 25px}
  
  .maininfo_r .btn {
    width: 248px;
  }
  .mail {
    display: table;
    margin: 0 auto;
  }
  .info_text{
    letter-spacing: 0.2em;
  }
}

/* ----------------------------------------------------
  Home contents frame
 ----------------------------------------------------	*/
.salon,
.school,
.design,
.campaign,
.topics {
  padding: 80px 0;
}
@media (max-width: 767px) {
  .salon,
  .school,
  .design,
  .campaign,
  .topics {
    padding: 40px 0;
  }
  .campaign {
    padding-bottom: 0;
  }
}

.school,
.campaign{
  background: #f6f3f3;
}

/* fadein animation */
.fadein {
  -webkit-transition: all 1s ease-out;
  transition: all 1s ease-out;
  opacity: 0
}
.fadein.active {
  opacity: 1
}
.fadein.move-to-top {
  -webkit-transform: translateY(50px);
  transform: translateY(50px)
}
.fadein.move-to-top.active {
  -webkit-transform: translateY(0);
  transform: translateY(0)
}

/* ----------------------------------------------------
  Home contents title
 ----------------------------------------------------	*/
.sec_title h2{
  margin-bottom:50px;
  padding-bottom: 40px;
  background:url("../images/top/icon_mark.png") center bottom no-repeat;
  background-size: 20px;
  font-size:30px;
  font-weight: normal;
  letter-spacing: 0.2em;
  text-indent: 0.2em;
  text-align: center;
}
@media (max-width: 767px) {
  .sec_title h2{
    margin-bottom: 30px;
    padding-bottom: 30px;
    background:url("../images/top/icon_mark.png") center bottom no-repeat;
    background-size: 14px;
    font-size: 24px;
    letter-spacing: 0.1em;
    text-indent: 0.1em;
  }
}

/* ----------------------------------------------------
  Home contents salon & school
 ----------------------------------------------------	*/
.flex{
  display: flex;
  justify-content: space-between;
}
.column, .campaign_column{
  width: 46%;
}
.column img, .campaign_column img{
  display: block;
  width:100%;
  height:auto;
  
}
.column h3{
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom:  1px solid #453b36;
  font-size: 20px;
  font-weight: normal;
  letter-spacing: 0.1em;
}
.column h3 + p {
  margin-bottom: 40px;
}
.column .btn {
  width: 75%;
  margin :40px auto 0;
}

@media (max-width: 767px) {
  .flex{
    flex-direction: column;
  }
  .column{
    width:100%;
    margin: 0;
  }
  .column section > h3 {
    margin-top: 20px;
  }
  .column .btn {
    width: 100% !important;
  }
  .design .btn {
    width: 100% !important;
  }
}

.flex_r{
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
}
@media (max-width: 767px) {
  .flex_r{
    flex-direction: column;
  }
}

/* ----------------------------------------------------
  Home contents design
 ----------------------------------------------------	*/
.imglist li{
  width: 255px;
  margin-bottom: 26px;
}
.imglist img{
  width: 100%;
  height:auto;
}
.imglist ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom:40px;
  overflow: hidden;
}
@media (max-width: 1099px) {
  .imglist ul {
    margin-bottom: 20px;
  }
  .imglist li{
    width: 23%;
    margin-bottom: 4%;
  }
}
@media (max-width: 767px) {
  .imglist li{
    width: 48%;
  }
}

.design .btn {
  width: 45%;
  margin: 0 auto;
}

/* ----------------------------------------------------
  Home contents campaign
 ----------------------------------------------------	*/
.campaign_column {
  letter-spacing: 0.1em;
}
.campaign_column h3{
  margin: 30px 0 10px;
  padding-bottom: 8px;
  border-bottom: none;
  font-size: 24px;
  font-weight: normal;
}
.campaign_column h3 + p {
  margin-bottom: 0;
}

@media (max-width: 1099px) {
  .campaign .flex {
    flex-direction: row;
  }
  .campaign_column{
    margin-bottom: 40px;
  }
  .campaign_column h3 {
    margin: 20px 0 0;
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .campaign .flex{
    flex-direction: column;
  }
  .campaign_column{
    width: 100%;
  }
}

.ribbon-wrapper {
  display: block;
  position: relative;
  box-sizing: border-box;
  }
.ribbon {  
  display: inline-block;
  position: absolute;
  top: -10px;
  left: 10px;
  margin: 0;
  padding: 16px 10px 12px;
  z-index: 2;
  width: 40px;
  text-align: center;
  font-size: 16px;
  line-height: 1.2;
  color: white;
  background: #75645c;
}
.ribbon:after {
  content: '';
  position: absolute;
  left: 0;
  top: 100%;
  height: 0;
  width: 0;
  border-left: 30px solid #75645c;
  border-right: 30px solid #75645c;
  border-bottom: 15px solid transparent;
}

/* ----------------------------------------------------
  Home contents topics
 ----------------------------------------------------	*/
.scroll_area {
  height: 230px;
  overflow: auto;
  letter-spacing: 0.1em;
}
.scroll_area::-webkit-scrollbar {
    width: 8px;
}
.scroll_area::-webkit-scrollbar-track {
  border-radius: 30px;
  background: #f6f3f3;
}
.scroll_area::-webkit-scrollbar-thumb {
  border-radius: 30px;
  background: #d8d1ce;
}
.scroll_area dt, 
.scroll_area dd{
  margin-bottom: 30px;
}
.scroll_area dt{
  float: left;
}
.scroll_area dd{
  margin-left: 100px;
  padding-right: 20px;
}
@media (max-width: 767px) {
  .scroll_area {
    height: 400px;
    overflow: auto;
    border-bottom: 1px solid #d8d1ce;
  }
  .scroll_area dt{
    float: none;
    margin-bottom: 10px;
  }
  .scroll_area dd{
    margin-left: 0;
  }
}

/* ----------------------------------------------------
  Home contents link_list
 ----------------------------------------------------	*/
.link_list{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.link_list_box {
  width: 30%;
  margin: 0 1.5% 5%;
  font-size: 16px;
  letter-spacing: 0.1em;
}
.link_list_box img{
  width: 100%;
}
@media (max-width: 767px) {
  .link_list_box {
    width: 47%;
    font-size: 14px;
    letter-spacing: 0.1em;
  }
}

/* ----------------------------------------------------
  Home contents bn_area
 ----------------------------------------------------	*/
.bn_area{
  margin-top: 45px;
  padding:76px 0;
  background: #ede7e7;
}
.bn_area ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.bn_area li{
  margin: 0 20px;
  align-self:center;
}
@media (max-width: 767px) {
  .bn_area{
    margin-top: 20px;
    padding: 30px 0;
  }
  .bn_area li {
      margin: 10px;
  }
}

/* ----------------------------------------------------
  footer
 ----------------------------------------------------	*/
footer{
  text-align: center;
}
.footer_wrapper{
  width: 1100px;
  margin:0 auto;
  display: flex;
  justify-content: space-between;
}
.footer_l, .footer_c, .footer_r {
  margin-top: 60px;
}
.footer_l {
  text-align: center;
}
.footer_l img {
  width: 123px;
}
.footer_c {
  margin-bottom: 30px;
  text-align: left;
}

.footer_c h4{
  margin-bottom: 10px;
  padding-bottom: 5px;
  border-bottom: 1px solid #453b36;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.footer_c h4 + p {
  margin-bottom: 40px;
}
.footer_c p{
  line-height: 2;
  letter-spacing: 0.1em;
}
.footer_c p span{
  display: block;
  padding-left: 5em;
  text-indent: -5em;
  line-height: 1.7;
}
.footer_r {
  text-align: center;
}
.footer_r .info_text{
  margin-top:20px;
}
.footer_r .mail {
  display: table;
  margin: 0 auto;
}

.school_form{
  margin-top:20px;
}
.school_form a{
  display: block;
  padding:15px;
  background: #f6f3f3;
  color:#453b36;
  text-align: center;
  letter-spacing: 0.1em;
  transition: 0.3s linear;
}
.school_form a:hover {
  background: #dcd3d3;
  text-decoration: none;
}

.footer_link {
  background: #f6f3f3;
}
.footer_link ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.footer_link li {
  vertical-align: text-bottom;
  letter-spacing: 0.2em;
}
.footer_link a {
  display: block;
  padding: 10px 20px;
  color: #453b36;
}
.footer_link a:hover {
  text-decoration: none;
  background: #dcd3d3;
}
.footer_link img {
  margin-bottom: -5px;
  width: 24px;
  height: 24px;
}
.copyright {
  padding: 28px 0 40px;
  color: #af9d93;
  font-size: 12px;
  letter-spacing: 0.1em;
}
@media (max-width: 1099px) {
  .footer_wrapper {
    width: 92%;
    padding: 0 4%;
  }
  .footer_c {
    padding: 0 3%;
  }
  .footer_r .tel {
    font-size: 22px;
    background: url(../images/top/icon_tel.png) 0px 11px no-repeat;
    background-size: 10px;
  }
}
@media (max-width: 767px) {
  .footer_wrapper{
    width: 100%;
    padding: 0 0%;
    flex-direction: column;
    font-size: 3.2vw
  }
  .footer_l {
    margin-top: 40px;
  }
  .footer_c{
    margin: 20px 0 0;
    text-align: center;
    padding: 0 5%;
  }
  .footer_c p span{
    margin-top: 1em;
    padding-left: 0;
    text-indent: 0;
  }
  .footer_c p i {
    display: none;
  }
  .footer_r {
    margin: 0 auto;
    padding: 10% 5%;
    background: #f6f3f3;
    width: 90%;
  }
  .footer_r .tel {
    font-size: 30px;
    background: url(../images/top/icon_tel.png) 0px 13px no-repeat;
    background-size: 13px;
  }
  .school_form a {
    background: #dcd3d3;
  }
  .footer_link{
    display: none;
  }
  .copyright {
      padding: 20px 0 ;
      font-size: 2.6667vw;
  }
}

/* ----------------------------------------------------
  pagetop 
 ----------------------------------------------------	*/
.pagetop {
	margin:0;
	position: fixed;
	bottom: 20px;
	right: 20px;
}
.pagetop a {
  position: relative;
	display: block;
	width: 50px;
	height: 50px;
  background: rgba(255,255,255,0.5);
}
.pagetop a:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
  text-decoration: none;
}
.pagetop a::after{
font-family: "Font Awesome 5 Free";
content: "\f077";
  font-size: 30px;
  font-weight: bold;
  color: #993c42;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
@media (max-width: 767px) {
  .pagetop {
    bottom: 0 !important;
    right: 0;
  }
}

/* ----------------------------------------------------
sub page title
 ----------------------------------------------------	*/
.contents_title {
  display: table;
  width: 100%;
  height: 230px;
  background: linear-gradient(90deg, #e4dcd8 0%, #f6f4f3 50%, #f6f4f3 0%, #e4dcd8 100%) no-repeat 50% 50% / 100% 100%;
  text-align: center;
}
.contents_title h1 {
  display: table-cell;
  vertical-align: middle;
  font-size: 30px;
  font-weight: normal;
  letter-spacing: 0.1em;
}
.contents_title h1 span {
  display: block;
  font-size: 14px;
}

.link_btn{
  margin: 70px auto 60px;
}
.link_btn div{
  display: table;
  width: 100%;
}
.link_btn a, 
.link_btn span{
  display: table-cell;
  width: 50%;
  height: 65px;
  font-size: 18px;
  letter-spacing: 0.1em;
  text-align: center;
  vertical-align: middle;
}
.link_btn.triple a, 
.link_btn.triple span{
  width: 33.3333% !important;
}
.link_btn a {
  background: #f5f2f2;
  color: #453b36;
  text-decoration: none;
}
.link_btn a:hover {
  background:#dcd3d3;
}
.link_btn span{
  background: #75645c;
  color: #fff;
}
@media (max-width: 767px) {
  .contents_title {
    height: 26.667vw;
    text-align: center;
  }
  .contents_title h1 {
    font-size: 5.6664vw;
    letter-spacing: 0.1em;
  }
  .contents_title h1 span {
    font-size: 2.6667vw;
    letter-spacing: 0.1em;
  }
  .link_btn.contents {
    width: 100%;
  }
  .link_btn{
    margin: 0 0 20px;
  }
  .link_btn a, 
  .link_btn span{
    height: 10vw;
    font-size: 3.2vw;
    letter-spacing: 0.1em;
  }
  #school .link_btn div a:nth-child(1), 
  #school .link_btn div span {
    font-size: 3vw;
    letter-spacing: 0;
  }
}

/* ----------------------------------------------------
sub page contents
 ----------------------------------------------------	*/
.contents_sub {
  margin-bottom: 100px;
}

.contents_sub section {
  margin-bottom: 100px;
}

.contents_sub h2 {
  margin: 40px 0;
  font-size: 24px;
  font-weight: normal;
  letter-spacing: 0.1em;
}
.contents_sub h3 {
  margin: 40px 0;
  padding: 5px 0;
  border-bottom: 1px solid #453b36;
  font-size: 18px;
  font-weight: normal;
  letter-spacing: 0.1em;
}
.contents_sub h4 {
  margin-top: 40px;
  margin-bottom: 20px;
  padding:10px;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.1em;
  background-color:#f5f2f2;
}

.contents_sub p{
  margin: 1em 0;
}

.contents_sub table {
  width: 100%;
  margin: 40px 0;
  border-top: 1px solid #ede7e7;
  
}
.contents_sub table th,
.contents_sub table td{
  padding: 10px 5px;
  border-bottom: 1px solid #ede7e7;
  text-align: left;
  vertical-align: top;
}
.contents_sub table th {
  font-weight: normal;
  white-space: nowrap
}

@media (max-width: 767px) {
  .contents_sub{
    font-size: 3.2vw;
  }
  .contents_sub section {
    margin-bottom: 10vw;
  }
  .contents_sub h2 {
    margin: 5.6664vw 0;
    font-size: 4.2672vw;
    letter-spacing: 0.1em;
  }
  .contents_sub h3 {
    margin: 5.6664vw 0;
    padding-bottom: 3.2vw;
    font-size: 3.7334vw;
    letter-spacing: 0.1em;
  }
  .contents_sub h4 {
    font-size: 3.2vw;
    letter-spacing: 0.1em;
  }
  .contents_sub table th,
  .contents_sub table td{
    font-size: 3.2vw;
  }
}

/* Menu page */
#menu h2 {
  font-size: 30px;
  padding: 15px 5px;
  border-bottom: 1px solid #453b36;
}
#menu h2 span{
  font-size: 18px;
}
#menu h3 {
  margin: 60px 0 0;
  padding: 0 0 0 10px;
  border-bottom: none;
  border-left: 5px solid #453b36;
}
@media (max-width: 767px) {
  #menu h2 {
    font-size: 5.6664vw;
  }
  #menu h2 span{
    font-size: 3.7334vw;
  }
}

/* School page */
.course_btn {
  font-size: 0;
}
.course_btn a {
  display: inline-block;
  margin: 0 1% 20px;
  width: 31%;
  text-align: center;
}
.course_btn a img{
  width: 100%;
  max-width: 300px;
  height: auto;
}
/* School table */
.contents_sub .table{
	margin: 0 0 40px 0;
  border-top: 1px solid #ede7e7;
}
.contents_sub dl{
	overflow:hidden; 
}
.contents_sub dt,.contents_sub dd{
	padding:10px 5px;
}
.contents_sub dt{
	float:left;
}
.contents_sub dd{
  padding-left: 12em;
  border-bottom: 1px solid #ede7e7;
}
.contents_sub dd:after{
	clear:both;
}
@media (max-width: 767px) {
  .course_btn a {
    width: 100%;
  }
  .contents_sub .table{
    margin: 0 0 20px 0;
    width: 100%;
  }
  .contents_sub dt,dd{
    display:block;
  }
  .contents_sub dl{
    width:100%;
    margin:0;
        }
  .contents_sub dt{
    width:100%;
    float:none;
    padding:5px 0 0 0;
    font-weight: bold;
  }
  .contents_sub dd{
    margin-left:0;
    padding:0 0 5px 0;
  }
}

/* Staff page */
.staff_column {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}
.staff_column .column{
  width: 26%;
}
.staff_column .column + .column {
  width: 70%;
}
.staff_column .column img{
  width: 100%;
  height: auto;
}
p.large{
	font-size: 24px;
	letter-spacing: inherit;
	margin: 0 0 20px 0;
}
p.large span{
	font-size: 14px;
}
p.dc{
  font-size: 16px;
}
p.strong{
	font-weight:bold;
}
p.strongc{
  font-size: 16px;
	font-weight:bold;
	margin-bottom: 40px;	
	color:#8B0000;
}
@media (max-width: 767px) {
  .staff_column {
    flex-direction: column;
  }
  .staff_column .column{
    width: 100%;
  }
  .staff_column .column + .column {
    width: 100%;
    margin-top: 3.2vw;
  }
  p.large{
	font-size: 4.2672vw;
  }
  p.dc{
    font-size: 3.2vw;
  }
}

/* Recruit page */

h3.recruitminititle {
    margin: 60px 0 0;
    padding: 0 0 0 10px;
    border-bottom: none;
    border-left: 5px solid #453b36;
}

.recruitcontainer div{
  position: relative;
}
.recruitservice div{
  left: 50%;
  margin: -25px 0 0 -25px;
}

#recruit img {
  margin: 0 auto;
  display: block;
}

#recruit img {
  margin-bottom: 20px; /* マージンの大きさは調整してください */
}



/* list */
ul.list{
	margin:10px 0 20px 0;
}

ul.list li{
	list-style: disc;
	list-style-position: outside;
	margin-bottom: 5px;
  margin-left: 1.5em;
}

ol li {
  list-style: decimal;
  list-style-position: outside;
  margin-bottom: 10px;
  margin-left: 2em;
}

ul.menulist{
	margin:0 0 10px 0;
}
ul.menulist li{
  font-size: 16px;
	list-style: disc;
	list-style-position: outside;
	margin-bottom: 10px;
  margin-left: 2em;
}

ul.anchor_link{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 70px;
}
ul.anchor_link li{
  margin: 0 20px 20px;
}
ul.anchor_link li a{
    position: relative;
    display: inline-block;
    padding: 0 0 0 21px;
    color: #993c42;
    vertical-align: middle;
    text-decoration: none;
    font-size: 18px;
}
ul.anchor_link li a:hover{
    text-decoration: underline;
}
ul.anchor_link li a::before,
ul.anchor_link li a::after{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}
ul.anchor_link li a::before{
    left: 3px;
    width: 7px;
    height: 1px;
    background: #993c42;
}
ul.anchor_link li a::after{
    left: 3px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #993c42;
    border-right: 1px solid #993c42;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
@media (max-width: 767px) {
  ul.menulist li{
    font-size: 3.2vw;
  }
  ul.anchor_link{
    margin-top: 10vw;
  }
  ul.anchor_link li a{
    font-size: 3.7334vw;
  }
}

/* image box */
.imgbox {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}
.imgbox.single .imgbox_column {
  width: 100%;
}
.imgbox.w70 .imgbox_column {
  width: 70%;
}
.imgbox.w70 .imgbox_column p {
  padding-right: 4%;
}
.imgbox.w70 .imgbox_column + .imgbox_column {
  width: 30%;
}
.imgbox.double .imgbox_column {
  width: 46%;
}
.imgbox .imgbox_column img {
  width: 100%;
  height: auto;
  margin-top: 1em;
}
.img_small{
  width: 300px !important;
}
@media (max-width: 767px) {
  .imgbox {
    flex-direction: column;
  }
  .imgbox.double .imgbox_column{
    width: 100%;
  }
  .imgbox.w70 .imgbox_column {
    width: 100%;
  }
  .imgbox.w70 .imgbox_column p {
    padding-right: 0;
  }
  .imgbox.w70 .imgbox_column + .imgbox_column {
    width: 100%;
  }
}

/* caution */
.caution{
  margin: 60px 0 40px;
  padding: 20px;
  background: #fcf9f9;
}

/* float */
.fl{
  float:left;
  margin-right: 20px;
}
.fr{
  float:right;
  margin-left: 20px;
}

/* margin */
.mb40{
  margin-bottom: 40px;
}
.mt40{
  margin-top: 40px;
}
.mt26{
  margin-top: 26px;
}

/* ===================================================================

smartphone menu

=================================================================== */
.navbar_toggle,
.nav-content {
  display: none;
}

@media (max-width: 767px) {
  header .logo {
    z-index: 9999;
  }
  .gnavi{
    display: none !important;
  }
  .nav-content {
    display: block;
    padding-top: 45px;
    background: #ebe6e3;
    position: absolute;
    width: 100%;
    height: 100vh;
    top: 0;
   }
  .nav-content ul{
    margin-top: 15px;
   }
  .nav-content ul li a {
    text-align: center;
    display: block;
    padding: 8px 0px;
    color: #453b36;
    font-size: 20px;
    letter-spacing: 0.1em;
  }
  .nav-content ul li a:hover {
    text-decoration: none;
  }
  .nav-content ul li a span{
    display: block;
    font-size: 10px;
  }
  .nav-content .btn{
    width: 70%;
    margin: 15px auto;
  }
  .nav-content ul.small{
    display: flex;
    justify-content: center;
	}
  .nav-content ul.small li {
		margin: 0 8px;
		border-bottom:none;
	}
  .nav-content ul.small li a{
      font-size: 12px;
  }
  .nav-content ul.small li a img{
      width: 18px;
      height: auto;
  }

  /* drawer menu */
  .drawer{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding: 0 1em;
  }
  .navbar_toggle{
    display: block;
    margin-top: 10px;
    z-index: 9999;
  }
  .navbar_toggle::after{
    content: "MENU";
    display: block;
    font-size: 8px;
    margin-top: 3px;
    letter-spacing: 0;
  }
  .navbar_toggle_icon {
    position: relative;
    display: block;
    height: 3px;
    width: 30px;
    background: #7e080f;
    -webkit-transition: ease .5s;
    transition: ease .5s;
  }
  .navbar_toggle_icon:nth-child(1) {
    top: 0;
  }
  .navbar_toggle_icon:nth-child(2) {
    margin: 6px 0;
  }
  .navbar_toggle_icon:nth-child(3) {
    top: 0;
  }
  /*OPEN時の動き*/
  .navbar_toggle.open .navbar_toggle_icon:nth-child(1) {
    top: 12px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  .navbar_toggle.open .navbar_toggle_icon:nth-child(2) {
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    opacity: 0;
  }
  .navbar_toggle.open .navbar_toggle_icon:nth-child(3) {
    top: -6px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  .navbar_toggle.open::after{
    opacity: 0;
  }
  
  .menu{
   -webkit-transform: translateX(-100%);
   transform: translateX(-100%);
   -webkit-transition:ease .5s;
   transition:ease .5s;
   z-index:1000;
  }
  /*OPEN時の動き*/
  .menu.open {
   -webkit-transform:translateX(0);
   transform:translateX(0);
   overflow-y: auto;
   -webkit-overflow-scrolling: touch;
  }
}

/* ----------------------------------------------------
  lightbox ajust 
 ----------------------------------------------------	*/
.lum-img{
  opacity: 1 !important;
}
.lum-lightbox {
  z-index: 3;
}
@media screen and (max-width: 460px) {
  .lum-lightbox-inner img {
    max-width: 100vw !important;
    max-height: 85vh !important;
  }
}