@charset "utf-8";

/*
/////sscss/////
Smart Style Complex Original Stylesheet Template.
URL:http://ss-complex.com/
Author:Seiji Okabe
*/

/*-----clearfix-----*/
.cf:after {content: " "; display: block;clear: both;height: 0;visibility: hidden;}
.cf {min-height: 1px;}
* html .cf {height: 1px;}

/*-----cleartext-----*/
.clearText {text-indent:100%;white-space:nowrap;overflow:hidden;}

/*-----common-----*/
/*all device*/
.wrapper {position: relative;}
.taRBlk {text-align: right;display: block;}
.noLine {text-decoration: none;}
.bold {font-weight: bold;}
.poC {margin: 0 auto;}
.bgFit {background-repeat: no-repeat;background-position: center;background-size: cover;}
.bgFit.ctn {background-size: contain;}
.kome {margin-left: 1.2em;}
.kome li {position: relative;list-style-type: none !important;}
.kome li:before {position: absolute;content: '※';left: -1.2em;top: 0;}
.taL {text-align: left;}
.taC {text-align: center;}
.taR {text-align: right;}
.fL {float: left;}
.fR {float: right;}
.posRel {position: relative;}
.lh0 {line-height: 0;}
.lhS {line-height: 1.4em !important;}
.fBox {margin-left: -4%}
.fAll {float: left;width: 96%;margin-left: 4%;}
.f1of2 {float: left;width: 46%;margin-left: 4%;}
.f1of3 {float: left;width: 29.3333%;margin-left: 4%;}
.f2of3 {float: left;width: 62.6666%;margin-left: 4%;}
.f1of4 {float: left;width: 21%;margin-left: 4%;}
.f3of4 {float: left;width: 71%;margin-left: 4%;}
.f1of5 {float: left;width: 16%;margin-left: 4%;}
.f2of5 {float: left;width: 36%;margin-left: 4%;}
.f3of5 {float: left;width: 56%;margin-left: 4%;}
.f4of5 {float: left;width: 76%;margin-left: 4%;}
.f1of6 {float: left;width: 12.6666%;margin-left: 4%;}
.f5of6 {float: left;width: 79.3333%;margin-left: 4%;}
.f1of7 {float: left;width: 10.2857%;margin-left: 4%;}
.f2of7 {float: left;width: 24.5714%;margin-left: 4%;}
.f3of7 {float: left;width: 38.8571%;margin-left: 4%;}
.f4of7 {float: left;width: 53.1428%;margin-left: 4%;}
.f5of7 {float: left;width: 67.4285%;margin-left: 4%;}
.f6of7 {float: left;width: 81.7142%;margin-left: 4%;}
.f1of8 {float: left;width: 8.5%;margin-left: 4%;}
.f3of8 {float: left;width: 33.5%;margin-left: 4%;}
.autoImg {width: 100%;height: auto;}
.autoImg.full {width: auto;max-width: 100%;height: auto;display: table;margin: 0 auto;}
.autoImg.lg {width: 80%;margin: 0 auto;display: block;}
.autoImg.md {width: 50%;margin: 0 auto;display: block;}
.autoImg.sm {width: 30%;margin: 0 auto;display: block;}
.hAuto {height: auto !important;}
.indent {padding-left:1em;text-indent:-1em;}
select::-ms-expand {
  display: none;
}
select {
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: '';
}
*:after,*:before {background-position: center;background-repeat: no-repeat;background-size: contain;}
/*sp*/
@media only screen and (max-width: 767px){
.wrapper {width: 100%;letter-spacing: 0.05em;line-height: 1.4em;}
.boldSp {font-weight: bold;}
.poCSp {margin: 0 auto;}
.hideSp {display: none !important;}
.taLSp {text-align: left;}
.taCSp {text-align: center;}
.taRSp {text-align: right;}
.fLSp {float: left;}
.fRSp {float: right;}
.fBoxSp {margin-left: -4%}
.fAllSp {float: left;width: 96%;margin-left: 4%;}
.f1of2Sp {float: left;width: 46%;margin-left: 4%;}
.f1of3Sp {float: left;width: 29.3333%;margin-left: 4%;}
.f2of3Sp {float: left;width: 62.6666%;margin-left: 4%;}
.f1of4Sp {float: left;width: 21%;margin-left: 4%;}
.f3of4Sp {float: left;width: 71%;margin-left: 4%;}
.f1of5Sp {float: left;width: 16%;margin-left: 4%;}
.f2of5Sp {float: left;width: 36%;margin-left: 4%;}
.f3of5Sp {float: left;width: 56%;margin-left: 4%;}
.f4of5Sp {float: left;width: 76%;margin-left: 4%;}
.f1of6Sp {float: left;width: 12.6666%;margin-left: 4%;}
.f5of6Sp {float: left;width: 79.3333%;margin-left: 4%;}
.f1of7Sp {float: left;width: 10.2857%;margin-left: 4%;}
.f2of7Sp {float: left;width: 24.5714%;margin-left: 4%;}
.f3of7Sp {float: left;width: 38.8571%;margin-left: 4%;}
.f4of7Sp {float: left;width: 53.1428%;margin-left: 4%;}
.f5of7Sp {float: left;width: 67.4285%;margin-left: 4%;}
.f6of7Sp {float: left;width: 81.7142%;margin-left: 4%;}
.f1of8Sp {float: left;width: 8.5%;margin-left: 4%;}
.f3of8Sp {float: left;width: 33.5%;margin-left: 4%;}
.autoImg {width: 100%;height: auto;}
.autoImg.fullSp {width: auto;max-width: 100%;height: auto;display: table;margin: 0 auto;}
.autoImg.lgSp {width: 90%;margin: 0 auto;display: block;}
.autoImg.mdSp {width: 50%;margin: 0 auto;display: block;}
.autoImg.smSp {width: 30%;margin: 0 auto;display: block;}
.hAutoSp {height: auto !important;}
.verBottom {vertical-align: bottom;}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.wrapper {width: 100%;letter-spacing: 0.05em;line-height: 1.8em;}
.boldPc {font-weight: bold;}
.poCPc {margin: 0 auto;}
.hidePc {display: none !important;}
.taLPc {text-align: left;}
.taCPc {text-align: center;}
.taRPc {text-align: right;}
.fLPc {float: left;}
.fRPc {float: right !important;}
.fBoxPc {margin-left: -4%}
.fAllPc {float: left;width: 96%;margin-left: 4%;}
.f1of2Pc {float: left;width: 46%;margin-left: 4%;}
.f1of3Pc {float: left;width: 29.3333%;margin-left: 4%;}
.f2of3Pc {float: left;width: 62.6666%;margin-left: 4%;}
.f1of4Pc {float: left;width: 21%;margin-left: 4%;}
.f3of4Pc {float: left;width: 71%;margin-left: 4%;}
.f1of5Pc {float: left;width: 16%;margin-left: 4%;}
.f2of5Pc {float: left;width: 36%;margin-left: 4%;}
.f3of5Pc {float: left;width: 56%;margin-left: 4%;}
.f4of5Pc {float: left;width: 76%;margin-left: 4%;}
.f1of6Pc {float: left;width: 12.6666%;margin-left: 4%;}
.f5of6Pc {float: left;width: 79.3333%;margin-left: 4%;}
.f1of7Pc {float: left;width: 10.2857%;margin-left: 4%;}
.f2of7Pc {float: left;width: 24.5714%;margin-left: 4%;}
.f3of7Pc {float: left;width: 38.8571%;margin-left: 4%;}
.f4of7Pc {float: left;width: 53.1428%;margin-left: 4%;}
.f5of7Pc {float: left;width: 67.4285%;margin-left: 4%;}
.f6of7Pc {float: left;width: 81.7142%;margin-left: 4%;}
.f1of8Pc {float: left;width: 8.5%;margin-left: 4%;}
.f3of8Pc {float: left;width: 33.5%;margin-left: 4%;}
.autoImg {width: 100%;height: auto;}
.autoImg.fullPc {width: auto;max-width: 100%;height: auto;display: table;margin: 0 auto;}
.autoImg.lgPc,.autoImgPc.lgPc {width: 80%;margin: 0 auto;display: block;}
.autoImg.mdPc,.autoImgPc.mdPc {width: 50%;margin: 0 auto;display: block;}
.autoImg.smPc,.autoImgPc.smPc {width: 30%;margin: 0 auto;display: block;}
.hAutoPc {height: auto !important;}
}
/*lightbox*/
.fs-lightbox-overlay {
    z-index: 110;
}
.fs-lightbox {
    z-index: 111;
}
.fs-lightbox-position {
    display: none;
}
.fs-lightbox-content,.fs-lightbox-container {
    overflow: inherit;
}
@media only screen and (max-width: 767px){
.fs-lightbox-close {
    width: 50px;
    height: 50px;
    color: #ddd;
}
.fs-lightbox-close:after {content: '×';position: absolute;width: 50px;height: 50px;text-align: center;line-height: 45px;font-size: 38px;background: #ddd;color: #333;top: 0;right: 0;}
.fs-lightbox-caption_toggle {display: none !important;}
.fs-lightbox-controls {height: 40px;background:none;}
.fs-lightbox-control_previous {width: 40px;height: 40px;background: none;color: #111;}
.fs-lightbox-control_next {width: 40px;height: 40px;background: none;color: #111;}
.fs-lightbox-control_previous:after,.fs-lightbox-control_next:after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    top: 10px;
    left: 10px;
}
.fs-lightbox-mobile.fs-lightbox-touch .fs-lightbox-controls {
    background-color: #fff;
}
.fs-lightbox-control_previous:after {
    background-image: url(../image/icon_arrow_left_white.png);
}
.fs-lightbox-control_next:after {
    background-image: url(../image/icon_arrow_right_white.png);
}
.fs-lightbox-mobile.fs-lightbox-touch .fs-lightbox-meta {
    /* width: 90%; */
    /* left: 50%; */
    /* margin-left: -45%; */
    /* height: auto; */
    /* bottom: 200px; */
    /* background-color: #fff; */
    /* box-sizing: border-box; */
    /* padding: 10px; */
}
.fs-lightbox-meta span {
    display: block;
    margin-bottom: 5px;
}
.fs-lightbox-mobile .fs-lightbox-content {
    height: 100%;
    background-color: #fff;
}
}
@media only screen and (min-width: 768px), print{
.fs-lightbox-close {
    width: 40px;height: 40px;
    background: none;color: #111;text-indent:100%;
    white-space:nowrap;overflow:hidden;
    right: -20px;
    top: -20px;
}
.fs-lightbox-close:after {
    content: '×';
    position: absolute;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 38px;
    font-size: 24px;
    color: #333;
    top: 0;right: 0;
    text-indent:0%;white-space:normal;overflow:visible;
    border-radius: 20px;
    background-color: #fafafa;
}
.fs-lightbox-caption_toggle {display: none !important;}
.fs-lightbox-position {background: #000;text-align: center;color: #fff;}
.fs-lightbox-control_previous,.fs-lightbox-control_next {
    width: 40px;
    height: 40px;
    background: none;
    color: #111;
    text-indent:100%;white-space:nowrap;overflow:hidden;
}
.fs-lightbox-control_previous {
    left: -60px;
}
.fs-lightbox-control_next {
    right: -60px;
}
.fs-lightbox-control_previous:after,.fs-lightbox-control_next:after {
    content: '';
    position: absolute;
    width: 40px;
    height: 40px;
    top: 0;
    left: 0;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.fs-lightbox-control_previous:after {
    background-image: url(../image/icon_arrow_left_white.png);
}
.fs-lightbox-control_next:after {
    background-image: url(../image/icon_arrow_right_white.png);
}
.fs-lightbox-meta_content .caption {padding: 15px;}
.fs-lightbox-meta_content .caption span {display: block;margin-bottom: 5px;}
}


/*-----customize-----*/

/*-----content-size-----*/
/*sp*/
@media only screen and (max-width: 767px){
.contentBox,.contentBoxSp,
.contentBoxM,.contentBoxMSp,
.contentBoxL,.contentBoxLSp {margin-left: 2.5% !important;margin-right: 2.5% !important;}
}
/*pc*/
@media only screen and (min-width: 768px){
.contentBox,.contentBoxPc {width: 1200px;margin-left: auto;margin-right: auto;}
.contentBoxM,.contentBoxMPc {width:800px;margin-left: auto !important;margin-right: auto !important; padding: 0;box-sizing: border-box;}
.contentBoxL,.contentBoxLPc {width:1000px;margin-left: auto !important;margin-right: auto !important; padding: 0;box-sizing: border-box;}
}

/*-----font-color-----*/
body {color: #333;}
.black {color: #333;}
.white {color: #fff;}
.gray {color: #999;}
.red {color: #d32f2f;}
.orange {color: #f4511e;}
a {color:#333;text-decoration:none;}
a:hover {text-decoration:none;}

@media only screen and (max-width: 767px){
.blackSp {color: #333;}
.whiteSp {color: #fff;}
.redSp {color: #d32f2f;}
.orangeSp {color: #f4511e;}
}

@media only screen and (min-width: 768px), print{
.blackPc {color: #333;}
.whitePc {color: #fff;}
.redPc {color: #d32f2f;}
.orangePc {color: #f4511e;}
}

/*-----background-color-----*/
body {background-color: #fafafa;}
.greenBg {background-color: #43A047;}
.blkBg {background-color: #333;}

/*-----font-family-----*/
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 400;
	src: url(//fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Regular.woff2) format('woff2'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Regular.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Regular.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 700;
	src: url(//fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Bold.woff2) format('woff2'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Bold.woff) format('woff'),
		url(//fonts.gstatic.com/ea/notosansjapanese/v3/NotoSansJP-Bold.otf) format('opentype');
}
html{font-family:'游ゴシック', YuGothic, Noto Sans Japanese, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;font-display: swap; font-weight: 500;}
.ming {font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
.qs {font-family: 'Quicksand', sans-serif; font-weight: bold;}
@media all and (-ms-high-contrast:none){
*::-ms-backdrop, html { font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;} /* IE11 */
*::-ms-backdrop, .ming { font-family:"ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ 明朝", serif !important;} /* IE11 */
}

/*-----font-size-----*/
/*all device*/
/*sp*/
@media only screen and (max-width: 767px){
.textXXL,.textXXLSp {font-size: 7vw;line-height: 1.8em;}
.textXL,.textXLSp {font-size: 6.5vw;line-height: 1.8em;}
.textLL,.textLLSp {font-size: 5.5vw;line-height: 1.6em;}
.textL,.textLSp {font-size: 5vw;line-height: 1.6em;}
.textM,.textMSp {font-size: 16px;line-height: 1.6em;}
.textS,.textSSp {font-size: 12px;}
.textXS,.textXSSp {font-size: 10px;}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.textXXL,.textXXLPc {font-size: 40px;line-height: 1.8em;}
.textXL,.textXLPc {font-size: 32px;line-height: 1.8em;}
.textLL,.textLLPc {font-size: 24px;line-height: 1.8em;}
.textL,.textLPc {font-size: 18px;}
.textM,.textMPc {font-size: 16px;}
.textS,.textSPc {font-size: 14px;}
.textXS,.textXSPc {font-size: 12px;}
}

/*-----margin-top-----*/
/*all device*/
/*sp*/
@media only screen and (max-width: 767px){
.mtXS,.mtXSSp {margin-top: 5px !important;}
.mtS,.mtSSp {margin-top: 15px !important;}
.mtM,.mtMSp {margin-top: 20px !important;}
.mtL,.mtLSp {margin-top: 30px !important;}
.mtXL,.mtXLSp {margin-top: 40px !important;}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.mtXS,.mtXSPc {margin-top: 10px !important;}
.mtS,.mtSPc {margin-top: 20px !important;}
.mtM,.mtMPc {margin-top: 40px !important;}
.mtL,.mtLPc {margin-top: 60px !important;}
.mtXL,.mtXLPc {margin-top: 100px !important;}
}

/*-----margin-bottom-----*/
/*all device*/
/*sp*/
@media only screen and (max-width: 767px){
.mbXS,.mbXSp {margin-bottom: 5px !important;}
.mbS,.mbSSp {margin-bottom: 15px !important;}
.mbM,.mbMSp {margin-bottom: 20px !important;}
.mbL,.mbLSp {margin-bottom: 30px !important;}
.mbXL,.mbXLSp {margin-bottom: 40px !important;}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.mbXS,.mbXSPc {margin-bottom: 10px !important;}
.mbS,.mbSPc {margin-bottom: 20px !important;}
.mbM,.mbMPc {margin-bottom: 40px !important;}
.mbL,.mbLPc {margin-bottom: 60px !important;}
.mbXL,.mbXLPc {margin-bottom: 80px !important;}
}

/*-----padding-top-----*/
/*all device*/
/*sp*/
@media only screen and (max-width: 767px){
.ptXS,.ptXSp {padding-top: 5px !important;}
.ptS,.ptSSp {padding-top: 15px !important;}
.ptM,.ptMSp {padding-top: 20px !important;}
.ptL,.ptLSp {padding-top: 30px !important;}
.ptXL,.ptXLSp {padding-top: 40px !important;}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.ptXS,.ptXSPc {padding-top: 10px !important;}
.ptS,.ptSPc {padding-top: 20px !important;}
.ptM,.ptMPc {padding-top: 40px !important;}
.ptL,.ptLPc {padding-top: 60px !important;}
.ptXL,.ptXLPc {padding-top: 80px !important;}
}

/*-----padding-bottom-----*/
/*all device*/
/*sp*/
@media only screen and (max-width: 767px){
.pbXS,.pbXSSp {padding-bottom: 5px !important;}
.pbS,.pbSSp {padding-bottom: 15px !important;}
.pbM,.pbMSp {padding-bottom: 20px !important;}
.pbL,.pbLSp {padding-bottom: 30px !important;}
.pbXL,.pbXLSp {padding-bottom: 40px !important;}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.pbXS,.pbXSPc {padding-bottom: 10px !important;}
.pbS,.pbSPc {padding-bottom: 20px !important;}
.pbM,.pbMPc {padding-bottom: 40px !important;}
.pbL,.pbLPc {padding-bottom: 60px !important;}
.pbXL,.pbXLPc {padding-bottom: 80px !important;}
}
/*-----paddingBox-----*/
/*all device*/
/*sp*/
@media only screen and (max-width: 767px){
.pdBoxS,.pdBoxSSp {box-sizing: border-box;padding-left: 5px;padding-right: 5px;}
.pdBoxM,.pdBoxMSp {box-sizing: border-box;padding-left: 10px;padding-right: 10px;}
.pdBoxL,.pdBoxLSp {box-sizing: border-box;padding-left: 20px;padding-right: 20px;}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.pdBoxS,.pdBoxSPc {box-sizing: border-box;padding-left: 10px;padding-right: 10px;}
.pdBoxM,.pdBoxMPc {box-sizing: border-box;padding-left: 20px;padding-right: 20px;}
.pdBoxL,.pdBoxLPc {box-sizing: border-box;padding-left: 40px;padding-right: 40px;}
}
/*-----UI-----*/
/*all device*/
/*sp*/
@media only screen and (max-width: 767px){
.menuArea {
    top: 0 !important;
    left: 0;
    width: 100%;
    z-index: 300;
}
.menuBtn {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 60px;
    height: 60px;
    cursor: pointer;
    z-index: 102;
    background-color: #B4B5B5;
}
.menuBtn span {
    display: block;
    position: absolute;
    height: 2px;
    width: 30px;
    background: #fff;
    left: 15px;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
}
.menuBtn span:nth-child(1) {
    top: 18px;
}
.menuBtn span:nth-child(2) {
    top: 28px;
}
.menuBtn span:nth-child(3) {
    top: 38px;
}
.menuBtn.open span:nth-child(1) {
    top: 28px;
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    transform: rotate(315deg);
}
.menuBtn.open span:nth-child(2) {
    width: 0;
    left: 50%;
}
.menuBtn.open span:nth-child(3) {
    top: 28px;
    -webkit-transform: rotate(-315deg);
    -moz-transform: rotate(-315deg);
    transform: rotate(-315deg);
}
.menuBtn .menuTitle {
	position: absolute;
	bottom: 3px;
	text-align: center;
	width: 100%;
	color: #333;
	font-size: 12px;
}
.grobalMenu {
	display: none;
    height: -webkit-calc(100vh - 60px);
    height: calc(100vh - 60px);
    margin-top: 60px;
    overflow-y: scroll;
    background-color: #e8e8e8;
}
.grobalMenu .menuBtnClose {
    position: absolute;
    width: 60px;
    height: 60px;
    top: 0;
    right: 0;
    z-index: 104;
}
.mainMenu {
    border-bottom: 1px solid rgba(255,255,255,0.6);
}
.mainMenu a {
    color: #333;
}
.toggleContents {
    display: none;
}
.mainMenu .topMenu {
    position: relative;
}
.mainMenu .topMenu > a {
    display: block;
    border-top: 1px solid rgba(255,255,255,0.6);
    font-weight: bold;
    font-size: 14px;
    padding: 10px;
    text-align: center;
}
.mainMenu .topMenu .close {
    display: block;
    font-weight: bold;
    font-size: 14px;
    padding: 10px;
    text-align: center;
}
.mainMenu .topMenu .close {
    padding-right: 15px;
}
.mainMenu .topMenu .close:before {
    content: '×';
    margin-right: 15px;
}
.mainMenu .topMenu > .toggleBtn {
    position: absolute;
    display: block;
    width: 30px;
    height: 30px;
    border: 1px solid #fff;
    right: 15px;
    top: 15px;
}
.mainMenu .topMenu > .toggleBtn:before {
    content: '';
    width: 16px;
    height: 16px;
    background-image: url(../image/icon/icon_plus_white.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -8px;
    margin-left: -8px;
}
.mainMenu .topMenu > .toggleBtn:after {
    content: '';
    width: 60px;
    height: 60px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -30px;
    margin-left: -30px;
}
.mainMenu .topMenu > .toggleBtn.active:before {
    background-image: url(../image/icon/icon_minus_white.png);
}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.mainMenu {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    min-width: 1200px;
}
.mainMenu li:first-child, 
.mainMenu li:last-child {
    /*margin-right: auto;*/
    margin-right: 5%;
}
#topHeader .mainMenu li:first-child, 
#topHeader .mainMenu li:last-child {
    margin: 0;
}
.grobalMenu .mainMenu .topMenu > a, .topMainMenu .topMenu > a  {
    font-size: 20px;
    padding: 0px 30px;
    color: #333;
    font-weight: bold;
    display: table-cell;
    position: relative;
    text-align: center;
    height: 140px;
    vertical-align: middle;
}
.grobalMenu .mainMenu .topMenu:hover > a, .topMainMenu .topMenu:hover > a {
    background-color: #333;
    color: #fff;
    transition: 0.3s;
}
}

/*-----header-----*/
/*all device*/
/*sp*/
@media only screen and (max-width: 767px){
.topHeader {
    width: 100%;
    height: 60px;
    position: fixed;
    top: 0;
    transition: 0.3s;
    background-color: #fff;
    z-index: 5;
}
.header {
    width: 100%;
    height: 60px;
    position: fixed;
    top: 0;
    transition: 0.3s;
    background-color: rgba(255, 255, 255, 0.9);
    z-index: 5;
}
.header .logo, .topHeader .logo {
    float: left;
    padding: 15px 0 0 5px;
}
.header .logo a, .topHeader .logo a {
    display: block;
    width: 100px;
    height: 35px;
    background-image: url(../image/logo.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.headOuter {
    padding-bottom: 140px;
}
.header {
    width: 100%;
    min-width: 1300px;
    height: 140px;
    background-color: rgba(255,255,255,0.9);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 5;
}
.header .logo {
    /* float: left; */
    padding: 42px 0 0 35px;
}
.header .logo a {
    display: block;
    width: 150px;
    height: 65px;
    background-image: url(../image/logo.png);
    background-repeat: no-repeat;
    background-size: contain;
}
.header .logo a:hover {
    opacity: 0.7;
    transition: 0.3s;
}
.topHeader {
    width: 100%;
    min-width: 1300px;
    height: 140px;
    background-color: rgba(255,255,255,0.9);
    z-index: 5;
    position: absolute;
    bottom: 0;
}

/* Fixed */
.topHeader.fixed {
    top: -140px;
    bottom: auto;
    position: fixed;
    -webkit-transform: translate(0px, 140px);
    transform: translate(0px, 140px);
    transition: 0.3s;
}
.topHeader.fixed .logo {
    /* float: left; */
    padding: 42px 0 0 35px;
}
.topHeader.fixed .logo a {
    display: block;
    width: 150px;
    height: 65px;
    background-image: url(../image/logo.png);
    background-repeat: no-repeat;
    background-size: contain;
}
.topHeader.fixed #grobalMenu ul {
    width: 100%;
    min-width: 1200px;
    height: 140px;
    background-color: rgba(255,255,255,0.7);
    top: 0;
    left: 0;
    transition: 0.3s;
    z-index: 5;
}
.topHeader.fixed #grobalMenu ul li {
    display: inline;
    width: auto;
    border-bottom: 0px;
}
.topHeader.fixed #grobalMenu ul li a:hover {
    color: #fff;
}
.topHeader.fixed #grobalMenu .mainMenu li:first-child, .topHeader.fixed #grobalMenu .mainMenu li:last-child {
    /*margin-right: auto;*/
        margin-right: 5%;
}
.topLogo {display: none;}
}

/*-----mainvisual-----*/
/*all device*/
.mainVisual {
    background: url(../image/landboard.jpg);
    background-size: cover;
}
.mainVisual.landboard {
	background: url(../image/landboard.jpg);
	background-size: cover;
}
.mainVisual.app {
	background: url(../image/app.jpg);
	background-size: cover;
}
.mainVisual.car {
    background: url(../image/car.jpg);
    background-size: cover;
}
/*sp*/
@media only screen and (max-width: 767px){
.mainVisual.landboard {
    background: url(../image/landboard_sp.jpg);
    background-size: cover;
    background-position: center;
}
.topHead {
    height: 300px;
    position: relative;
    background: linear-gradient(90deg,#c0c0c0 0%,#c0c0c0 50%,#e8e8e8 50%,#e8e8e8 100%);
}
.topHead img {
    width: 100px;
    margin: 0 auto;
    display: block;
    padding: 160px 0 0;
}
.topHead:before ,.topHead:after {
    content: '';
    display: block;
    width: 3px;
    height: 30px;
    background-color: #000;
    position: absolute;
    left: 50%;
}
.topHead:before {top:0; margin-left: -3px; margin-top: 100px;}
.topHead:after {bottom:0; margin-left: -3px; margin-bottom: 40px;}
.mainVisual {
    height: 150px;
    position: relative;
    margin-top: 60px;
}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.topHead {
    height: 600px;
    min-width: 1300px; 
    position: relative;
    background:linear-gradient(90deg,#c0c0c0 0%,#c0c0c0 50%,#e8e8e8 50%,#e8e8e8 100%);
}
.topHead img {
    width: 164px;
    height: 69px;
    margin: 0 auto;
    display: block;
    padding: 265px 0 0;
}
.topHead:before ,.topHead:after {
    content: '';
    display: block;
    width: 11px;
    height: 56px;
    background-color: #000;
    position: absolute;
    left: 50%;
}
.topHead:before {top:0; margin-left: -5px; margin-top: 100px;}
.topHead:after {bottom:0; margin-left: -5px; margin-bottom: 100px;}
.mainVisual {
    height: 435px;
    min-width: 1200px;
    position: relative; 
}
.mainVisual.car,
.mainVisual.app,
.mainVisual.landboard {
    margin-top: 140px;
}
}

/*-----footer-----*/
/*all device*/
.topBtn {right: 0;}
/*sp*/
@media only screen and (max-width: 767px){
.footer {
}
.topBtn {
    width: 50px;
    height: 135px;
    position: absolute;
    text-align: center;
    overflow: hidden;
}
.topBtn span {
    position: absolute;
    z-index: 1;
    width: 70px;
    left: -15px;
    bottom: 5px;
    color: #5d4037;
    font-weight: bold;
    font-size: 12px;
}
.topBtn span:after {
    content: '';
    width: 15px;
    height: 45px;
    background-image: url(../image/icon/icon_arrow_top_black.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 15px;
    left: 27px;
}

.footer {
    border-top: 1px solid #333;
    margin-top: 50px;
}
.topBtn {
    width: 40px;
    height: 40px;
    position: absolute;
    text-align: center;
    overflow: hidden;
    background-color: #333;
}
.topBtn:after {
    content: '';
    width: 25px;
    height: 25px;
    background-image: url(../image/icon/icon_arrow_top_white.png);
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.footer {
    border-top: 1px solid #333;
    margin-top: 100px;
}
.topBtn {
    width: 64px;
    height: 64px;
    position: absolute;
    text-align: center;
    overflow: hidden;
    background-color: #333;
}

.topBtn:after {
    content: '';
    width: 45px;
    height: 45px;
    background-image: url(../image/icon/icon_arrow_top_white.png);
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
}
}

/*-----contents-----*/
/*all device*/
.price {font-family: Noto Sans Japanese;}
.snsBox {
    width: 100px;
    margin: 0 auto;
    font-size: 0;
    letter-spacing: -100px;
}
.snsBox div {
    display: inline-block;
    width: 50%;
    box-sizing: border-box;
    padding: 0 8px;
    vertical-align: bottom;
}
.beltImg.app01 {background: url(../image/appImg01.jpg);}
.beltImg.app02 {background: url(../image/appImg02.jpg);}
/*sp*/
@media only screen and (max-width: 767px){
.picNumSp.n1:after {content: '1';}
.picNumSp.n2:after {content: '2';}
.picNumSp.n3:after {content: '3';}
.picNum:after, .picNumSp:after {
    font-size: 24px;
    font-weight: bold;
    padding: 14px 18px;
    background-color: #000;
    color: #fff;
    border-radius: 50px;
    top: 0;
    left: 50%;
    margin-top: -24px;
    margin-left: -20px;
    position: absolute;
    z-index: 1;
}
.overView dt {
    font-weight: bold;
}
.overView dd {
    margin-bottom: 10px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
}
.price {
    font-size: 42pt;
    font-weight: bold;
    line-height: 1;
}
.beltImg {
    height: 150px;
    position: relative;
}
.beltImg.app01, .beltImg.app02 {
	background-size: cover;
    background-position: left top;
}
.beltImg.app02.bgPosR {
	background-position: right top;
}
.specList li {
    margin: 10px;
    font-weight: bold;
}
.specList li span {
    padding-left: 10px;
}
.smallList {
	list-style: disc;
    margin: 0 auto;
    padding: 0 25px;
}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.picNum.n1:after {content: '1';}
.picNum.n2:after {content: '2';}
.picNum.n3:after {content: '3';}
.picNum:after {
    font-size: 24px;
    font-weight: bold;
    padding: 14px 20px;
    background-color: #000;
    color: #fff;
    border-radius: 50px;
    top: 0;
    left: 50%;
    margin-top: -24px;
    margin-left: -10px;
    position: absolute;
    z-index: 1;
}
.beltImg {
    height: 435px;
    background-size: cover;
    background-position: left top;
    min-width: 1200px;
    position: relative;
}
.price {
    font-size: 86pt;
    font-weight: bold;
    line-height: 1;
}
.leftPadding20 {padding-left: 20px;}
.specList li {
    margin: 10px;
    font-weight: bold;
}
.specList li span {
    padding-left: 20px;
}
.smallList {
    list-style: disc;
    width: 400px; 
    margin: 0 auto;
}
.overView dt{
    float: left;
    width: 25%;
    text-align: right;
    font-weight: bold;
}
.overView dd{
    margin-left: 30%;
    margin-bottom: 10px;
}
span.ancLink {
    position: relative;
    top: -150px;
    display: block;
}
}


/*-----ttl-----*/
/*all device*/
.chip {position: relative;}
.chip:before {
    content: '';
    display: block;
    width: 24px;
    height: 6px;
    background-color: #000;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0px auto 0;
}
/*sp*/
@media only screen and (max-width: 767px){
.meritBox {display: table;}
.meritNumber {
    background-color: #333;
    font-size: 4.5vw;
    border-radius: 50%;
    color: #fff;
    font-weight: bold;
    display: inline-block;
    width: 40px;
    height: 40px;
    vertical-align: middle;
    text-align: center;
    line-height: 40px;
}
.meritText {
    display: table-cell;
    width: 100%;
    vertical-align: middle;
    padding-left: 10px;
    font-weight: bold;
    line-height: 1.3;
}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.meritNumber {
    background-color: #333;
    padding: 15px 20px;
    border-radius: 50%;
    color: #fff;
    font-size: 22px;
    margin-right: 20px;
    font-weight: bold;
}
.meritText {
    font-weight: bold;
}
}

/*-----btn-----*/
/*all device*/
.btn a {
    position: relative;
    border: 1px solid #333;
    display: table;
    border-radius: 10px;
    padding: 10px 100px;
}
.btn a:hover {color: #fff; background-color: #333;}
.btn.arrowRight a:after {
    content: '';
    background-image: url(../image/icon/icon_arrow_right_black.png);
    width: 16px;
    height: 16px;
    position: absolute;
    top: 50%;
    right: 20px;
    margin-top: -8px;
}
/*sp*/
@media only screen and (max-width: 767px){
.btn a {padding: 10px 90px;}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.btn.arrowRight a:hover:after {
    background-image: url(../image/icon/icon_arrow_right_white.png);
}
}

/*-----form-----*/
/*all device*/
input[type="submit"],
input[type="button"],
input[type=text], 
input[type=email], 
input[type=tel],
textarea {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}
form#mail_form dl dt span.required,
form#mail_form dl dt span.optional{
  display : none;
}
form#mail_form dl dd span.error_blank,
form#mail_form dl dd span.error_format,
form#mail_form dl dd span.error_match{
    display : block;
    color : #ff0000;
}

/*sp*/
@media only screen and (max-width: 767px){
input[type=text], input[type=email], input[type=tel], select {
    width: 100%;
    height: 40px;
    margin-bottom: 4%;
    border: 1px solid #ccc;
    color: #555;
    box-sizing: border-box;
    font-size: 16px;
    line-height: 30px;
    padding: 0 10px;
    background-color: #fafafa;
    border-radius: 0;
}
textarea {
    width: 100%;
    height: 200px;
    border: 1px solid #ccc;
    color: #555;
    box-sizing: border-box;
    font-size: 16px;
    line-height: 30px;
    padding: 5px 10px;
    background-color: #fafafa;
}
input[type="button"] {
    /* overflow: hidden; */
    position: relative;
    background-color: #fafafa;
    border: 1px solid #333;
    display: table;
    border-radius: 10px;
    padding: 10px 50px;
    font-size: 5vw;
    font-weight: bold;
    margin: 0 auto;
    outline: none;
}
}
/*pc*/
@media only screen and (min-width: 768px), print{
.formTable {}
.formTable dl,
.formTable dt,
.formTable dd {
  box-sizing: border-box;
}
.formTable dt {padding: 20px 10px 0 0px;}
.formTable dd {padding: 10px 10px 0 10px;}
.formTable dt {
    width: 35%;
    float: left;
    text-align: right;
}
.formTable dd {
  margin-left: 35%;
  padding-bottom: 10px;
}
.formTable dd:after {
  content: '';
  display: block;
  clear: both;
}
.contentThanks {
    width: 600px;
    margin-left: auto;
    margin-right: auto;
}
input[type=text], input[type=email], input[type=select], input[type=tel], select {
    width: 100%;
    height: 50px;
    border: 1px solid #ddd;
    color: #555;
    box-sizing: border-box;
    line-height: 40px;
    padding: 0 10px;
    font-size: 16px;
    background-color: #fafafa;
    border-radius: 0;
}
input[type="button"] {
    position: relative;
    border: 1px solid #333;
    background-color: #fafafa;
    display: table;
    border-radius: 10px;
    padding: 12px 60px;
    font-size: 18px;
    font-weight: bold;
    margin: 0 auto;
    outline: none;
}
input[type="button"]:hover {
    background-color: #333;
    color: #fff;
    outline: none;
}
textarea {
    width: 100%;
    height: 200px;
    border: 1px solid #ddd;
    color: #555;
    box-sizing: border-box;
    font-size: 16px;
    line-height: 30px;
    padding: 5px 10px;
    background-color: #fafafa;
}
}

/*-----スクロールアニメーション-----*/
/*all device*/
.mtext{
    text-align:center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.motion-txt {
    display: inline-block;
    position: relative;
    overflow: hidden;
    padding: 0 10px;
}
.motion-txt.pics {
    padding: 0;
    vertical-align: bottom;
}
.motion-txt:after {
    content: '';
    position: absolute;
    opacity: 1;
    left: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    background-color: #000;
    transform: translate3d(-101%, 0, 0);
    transition-timing-function: ease;
}
.js-scroll.show .motion-txt:after {
    transition-property: transform, opacity;
    transition-duration: 0.5s;
    transition-delay: 0s;
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
    transform: translate3d(0, 0, 0);
}
.js-scroll.done .motion-txt:after {
    transition-property: transform;
    transition-duration: 0.5s;
    transition-delay: 0s;
    transition-timing-function: cubic-bezier(0.0, 0.0, 0.58, 1);
    transform: translate3d(101%, 0, 0);

}
.motion-txt .motion-inner {
    font-weight: bold;
    display: inline-block;
    vertical-align: bottom;
    opacity: 0;
}
.motion-txt.pics .motion-inner img {
    display: block;
    transform: translateX(-100px);
    vertical-align: bottom;
}
.js-scroll.done .motion-txt .motion-inner {
    opacity: 1;
}
.js-scroll.done .motion-txt.pics .motion-inner img {
    transform: translateX(0px);
    opacity: 1;
    transition-duration: 0.5s;
    transition-delay: 0s;
    transition-timing-function: cubic-bezier(0.0, 0.0, 0.58, 1);
    vertical-align: bottom;
    display: block;
}   


