@charset "utf-8";

/* base */
#gnav>ul {align-items: center; line-height: 1.35;}
.floPc .floBox>li a { line-height: 1.35;}
.floPc .floBox>li a span {padding-left: 35px;}

.ttl_stripe {font-family: 'Arial',sans-serif; line-height: 1; padding: 15px 1.5em; font-size: 1.7em; overflow:hidden;}
.ttl_stripe::after {border-bottom: solid 85px #fff ;}
.ttl_stripe::before {border-bottom: solid 85px transparent  ;}



.fnav>ul>li>a {padding-left: 1.5em; line-height: 1.5; margin-bottom: 0.3em;}
.fnav>ul>li>ul>li>a { line-height: 1.5; margin-bottom: 0.5em;}



/* ================================================================
  レスポンシブ
=================================================================== */

/* 600以上(PC・タブレット) */
@media screen and (min-width: 600px) {


}

/* 960px以上(PC) */
@media screen and (min-width: 960px) {
  #gnav>ul {align-items: stretch;}
  #gnav li {display:flex; align-items: center; justify-content: center; width: 16.66%;  letter-spacing: 0.085em;}
  .fnav>ul {width: 24%;}

}



/* ================================================================
  タブレット
=================================================================== */
/* 1024以下 (タブレット横以下) */
@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 959px) {
  .fnav>ul {width: 31%;}
  .menu-button { margin-left: auto;}

  #gnav .col-menu li a { padding-left: 0;}
  #gnav .col-menu li a::before { display: none;}

}



/* ================================================================
  スマホ
=================================================================== */

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

  .floPc .floBox>li a span {padding-left: 20px;}
  .floPc .floBox>li a {padding: 0.8em;}
  .floPc .floBox>li.siryo a {padding: .8em;}

  .floPc .floBox>li a span::before {left: 2px;}
  .floPc .floBox>li.siryo a span::before {left: 2px;}

  .fnav>ul {width: 48%;}
  .fnav ul.aboutdormy{width: 49%;}
  .fnav>ul>li>a {line-height: 1.35; margin-bottom: .5em;}

  .subTtl {line-height: 1.5;}

  .ttl_stripe {font-size: 1.2em;}

  /* 横スクロール */
  .scrollWrap > .scroll:before { content: "You can scroll horizontally →";}

  .floPc .floBox>li { width: 50%; float: right;}
  .floPc .floBox>li.bukken {width: 50%; float: left;}
}