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

img { width: auto; max-width: 100%; height: auto;}
.comingSoon { cursor: default;}
.flexBox { display: flex; flex-wrap: wrap; justify-content: space-between;}
.flexBox > * { flex-grow:0; flex-shrink:1;}
.flexBox.center {justify-content: center;}
.flexBox.noWrap { flex-wrap: nowrap;}
.flexBox.start { justify-content: flex-start;}
.mb20 { margin-bottom: 20px !important;}
.mb40 { margin-bottom: 40px !important;}
.mb60 { margin-bottom: 60px !important;}
.mb80 { margin-bottom: 80px !important;}
.alignCenter { text-align: center; }


.content { width: 100%; max-width: 1040px; box-sizing: border-box; padding:0 20px; margin: 0 auto;}
.bg { background: url("../img/common/bg_main_01.jpg") center center / 100% auto repeat-y; padding: 40px 0;}

/* HEADER */
#header { background: rgba(255,255,255,1); box-shadow: 0 3px 0 0 #000; padding: 10px 0 10px 0; position:relative;}
#header .logoBox { flex-basis:32.7%; }
#header .btnBox { flex-basis:49%;}
#header .cvBox { flex-basis:42.85%; margin: 0 0 10px 0; }
#header .cvBox ul li { flex-basis:calc(50% - 5px);}
#header .telBox { flex-basis:55.10%; margin: 0 0 10px 0 ;}

#gNavi { }
#gNavi ul {}
#gNavi ul li:nth-of-type(1) { border-left:#000 solid 1px;}
#gNavi ul li { display:inline-block; font-size:12px; margin:0 5px 0 0 ;}
#gNavi ul li a { color:#000; text-decoration:none; padding:0 5px; border-right:#000 solid 1px; line-height:1;}

#gNavi2 { margin: 0 auto 40px auto;}
#gNavi2 ul li { flex-basis:calc( ( 100% - 50px ) / 6 );}


/* PAGE TOP */
#pageTop { position:fixed; right:20px; bottom:20px; width:41px; height:41px; z-index:2000; }
#pageTop a { position:relative; z-index:2; }

/* FOOTER */
#footerBnr {  display:flex; justify-content:space-between; margin:0 auto 0 auto; padding:20px 0; }
#footerBnr ul { width:100%;}
#footerBnr ul li { flex-basis:calc( ( 100% - 20px ) / 2 );}
#footerBnr a { display:block; text-align:center; box-sizing:border-box; padding:1em 0; font-size:24px; text-decoration:none; color:#fff; background:#2ca1d2; }

#footer { background: rgba(255,255,255,1); box-shadow: 0 -3px 0 0 #ccc; padding: 3px 0 0 0; position:relative;}
#footer::after { content: ''; display: block; width:100%; height: 1px; line-height: 1; top:2px ; left: 0px; position: absolute; background: #ccc;}
#footer .flexBox p { display: block; font-size: 12px; font-weight: bold; margin: 0 0 0.5em 0;}
#footer .flexBox .logoBox { flex-basis:38.31%; padding: 10px 0; margin: 0 10px 0 0 ;}
#footer .flexBox .telBox { flex-basis:36.68%; padding: 10px 0; }

#footerSpBnr { display:none; background:#00b7ee; position:fixed; bottom:0; left:0; width:100%; margin:0; padding:0; z-index:99999999; }
#footerSpBnr ul { width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; }
#footerSpBnr ul li { margin:0; }
#footerSpBnr ul li:nth-of-type(1)  { flex-grow:0; flex-shrink:1; flex-basis:40%; }
#footerSpBnr ul li:nth-of-type(2)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li:nth-of-type(3)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li:nth-of-type(4)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li a,
#footerSpBnr ul li a:hover { display:block;  text-align:center; line-height:1; }
#footerSpBnr ul li a img { width:100%; height:auto; }

/* BASIC STYLE */
.basicSubTitle { margin: 0 0 40px 0; }
.basicMiddleTitle {margin: 0 0 20px 0; padding: 0 0 5px 0; border-bottom: #333 solid 1px; font-size: 24px;}
.basicBigText { font-size: 24px; font-weight: bold; margin: 0 0 40px 0 ; line-height:1.5em;}
.basicText { font-size: 16px; line-height: 2em; display: block;}
.basicCaption { font-size: 12px; line-height: 1.5em; display: block;}

/* SMARTPHONE MENU */
#spMenu { box-sizing: border-box; padding: 20px; position: fixed; z-index: 9999; width: 100%; height: 100%; left: -100%; top:0; opacity:0; background: rgba(255,255,255,0.9); transition:opacity 0.5s linear 0s, left 0.5s linear 0s;}
#spMenu .logoBox { padding: 0 0 2.8% 0; margin: 0 0 2.8% 0; border-bottom: #ccc solid 1px; text-align: center;}
#spNavi { margin: 0 0 20px 0;}
#spNavi ul li { flex-basis:calc( ( 100% - 40px ) / 3 ); margin: 0 0 20px 0;}
#spCv { margin: 0 0 20px 0;}
#spCv ul li { flex-basis:calc( ( 100% - 20px ) / 2 );}
#spMenu .closeBtn { padding: 1.4% 0; text-align: center; border-top: #333 solid 1px; border-bottom: #333 solid 1px; width:60%; margin:0 auto;}

/* add 19.08.30 */
.linkoff a{ opacity: 0.6!important; pointer-events: none!important;}
.linkoff a:hover{ pointer-events: none!important;}



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

}

@media screen and (min-width:768px) {
  .spOnly { display:none; }
  .imgOver:hover { filter: contrast(1.2); transition: filter 0.5s linear 0s; }
}
@media screen and (max-width:767px) {
  .pcOnly { display:none; }

  /* HEADER */
  #header .logoBox { flex-basis:50%;}
  #header .btnBox { flex-basis:25%; padding: 0;}
  #header .cvBox { display: none;}
  #header .telBox { display: none;}
  #gNavi { display: none;}
  #header .spMenu { font-size: 5vw; display: block; text-align: right; padding: 0.5em 0; box-sizing: border-box; width: 100%;}

  .basicSubTitle { font-size:6vw;}
  .basicMiddleTitle { font-size: 5vw; }
  .basicStrongText { font-size: 4vw;}
  .basicText { font-size: 14px; }

  #gNavi2.active { position: fixed; width: 100%; height: 100%; top:0; left: 0; background: rgba(255,255,255,0.9); z-index:100000000; box-sizing: border-box; padding:15% 20px 20px 20px ;}
  #gNavi2.active .spMenu { display: block; background: #7ea19a; color: #fff; font-size: 4vw; padding: 0.25em 0; text-align: center; font-weight: bold; margin: 40px 0 0 0;}
  #gNavi2 ul li { flex-basis:calc( (100% - 20px) / 3); margin: 0 0 10px 0;}

  /* PAGE TOP */
  #pageTop { bottom:25vw; }

  /* FOOTER */
  #footer { padding-bottom:20%; }
  #footer .flexBox .logoBox { flex-basis:100%; margin: 0 0 10px 0; text-align: center;}
  #footer .flexBox .telBox { flex-basis:100%; margin: 0 0 10px 0; text-align: center;}
  #footer #copyRight  { padding:5px 0; }

  #footerSpBnr { display:block; }

  /* SMARTPHONE MENU */
  #spMenu.active { left:0; opacity:1; box-shadow:0 0 5px 5px rgba(0,0,0,0.2);}
}