@charset "UTF-8";
/* ######################################################################################

　ボタン　button

###################################################################################### */
.button {
    opacity: 1;
    display: inline-block;
    position: relative;
    border: none;
    -webkit-appearance: none;
    box-shadow: none;
    border: 1px solid #000000;
    border-radius: 3px;
    background: #000000;
    font-size: 1.5rem;
    font-weight: bold;
    color: #fff;
    vertical-align: middle;
    line-height: 1;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}
.button.block {
    display: block;
    width: 100%;
}
.button.block + .block {
    margin-top: 0.5em;
}
@media print, screen and (min-width: 768px) {
    .button {
        padding: 1.2em 2.2em;
        font-size: 1.5rem;
    }
    .button.small {
        padding: 1.1em 2.2em;
        font-size: 1.5rem;
    }
    .button.large {
        min-width: 300px;
        padding: 1.5em 2.6em;
        font-size: 1.6rem;
    }
}
@media print, screen and (max-width: 767px) {
    .button {
        padding: 1.5em 1.5em;
        font-size: 1.3rem;
        min-width: 220px;
    }
    .button.small {
        padding: 1.5em 1.5em;
        font-size: 1.3rem;
        min-width: 220px;
    }
    .button.large {
        padding: 1.5em 1.5em;
        font-size: 1.3rem;
        min-width: 220px;
    }
}
.button.form-submit {
    -webkit-transition: background-color 0.5s ease;
    -moz-transition: background-color 0.5s ease;
    -o-transition: background-color 0.5s ease;
    transition: background-color 0.5s ease;
}
.button.before:after, .button.after:after {
    margin-left: 0.5em;
}
.button.before:before, .button.after:before {
    margin-right: 0.5em;
}
.button.before:before, .button.after:after {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: inline-block;
    vertical-align: middle;
    content: "";
    width: 1em;
    height: 1em;
}
.button.ico.before:before, .button.ico.after:after {
    content: "";
    width: 6px;
    height: 10px;
    background-size: contain !important;
}
.button.before.snap, .button.after.snap {
    padding-left: 2em;
    padding-right: 2em;
}
.button.before.snap:before, .button.after.snap:after {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 0.75em;
    height: 0.75em;
}
.button.before.snap:after, .button.after.snap:after {
    right: 1.75em;
}
.button.before.snap:before, .button.after.snap:before {
    left: 1.75em;
}
@media print, screen and (min-width: 768px) {
    .button.before {padding: 1.0769em 1.9231em 0.9231em 2.7692em;}
    .button.before.large {padding: 1.5em 1.9231em 1.5em 2.7692em;}
    .button.before:before {
        left: 18px;
    }
    .button.before.large:before {
        left: 34px;
    }

    .button.after {padding: 0.9em 2.7em 1em 1.9em;}
    .button.after.large {padding: 1.5em 2.7692em 1.5em 1.9231em;}
    .button.after:after {
        right: 18px;
    }
    .button.after.large:after {
        right: 18px;
    }
}
@media print, screen and (max-width: 767px) {
    .button.before.large:before {
        left: 22px;
    }
    .button.after:after {
        right: 22px;
    }
}



.button.disabled {
    box-shadow: none;
    cursor: no-drop;
    background: #cccccc!important;
    color: #aaaaaa!important;
    border-color: #cccccc!important;
}
.button.round {
    border-radius: 3em;
}
.button.black {
    border-width: 2px;
    background: #000000;
    color: #ffffff;
}
.button.black:hover{ background: #fff;
    color: #000000;
border: 2px solid #000000;}

.button.black.reverse {
    border: 2px solid #000000;
    background: #ffffff;
    color: #161616;
}
.button.black.reverse:hover{
    border: 2px solid #000000;
    background: #000000;
    color: #ffffff;
}
.button.gray {
    border: 2px solid #505050;
    background: #505050;
    color: #ffffff;
}
.button.gray:hover {
    border: 2px solid #505050;
    background: #ffffff;
    color: #505050;
}
.button.gray.reverse {
    border: 2px solid #505050;
    background: #ffffff;
    color: #161616;
}
.button.gray.reverse:hover{
    border: 2px solid #505050;
    background: #000000;
    color: #ffffff;
}
.button.graylight.reverse {
    border: 2px solid #ccc;
    background: #ffffff;
    color: #161616;
}
.button.graylight.hoverGreen.reverse:hover{
    background: #00B2BB;
    border-color: #00989F;
}

.button.orange {
    border: 1px solid #FB9E57;
    background: #FB9E57;
    color: #ffffff;
}
.button.orange:hover{
    border: 1px solid #FB9E57;
    background: #ffffff;
    color: #FB9E57;
}
.button.orange.reverse {
    border: 1px solid #FB9E57;
    background: #ffffff;
    color: #FB9E57;
}
.button.orange.reverse:hover {
    border: 1px solid #FB9E57;
    background: #FB9E57;
    color: #fff;
}
.button.orange.ico.before.download:before, .button.orange.ico.after.download:after {
    background-image: url(../img/contents/ico_download.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    width: 1em;
    height: 1em;
    right: 2em;
}
.button.orange.ico.before.download:hover:before, .button.orange.ico.after.download:hover:after {
    background-image: url(../img/contents/ico_download_orange.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}
.button.green{
    border-color: #00B2BB;
    background: #00B2BB;
    color: #ffffff;
}
.button.green:hover{
    border-color: #00B2BB;
    background: #ffffff;
    color: #00B2BB;
}
.button.yellowgreen{
    border-color: #A4D16A;
    background: #A4D16A;
    color: #ffffff;
}
.button.yellow:hover{
    border-color: #A4D16A;
    background: #ffffff;
    color: #A4D16A;
}
.button.white{
    border-color: #E8E8E8;
    background: #ffffff;
    color: #161616;
}
.button.white:hover{
    border-color: #E8E8E8;
    background: #ffffff;
    color: #161616;
}
.button.green.ico.before.arrow:before, .button.green.ico.after.arrow:after {
    background-image: url(../img/contents/ico_arrow_white.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}
.button.green.ico.before.arrow:hover:before, .button.green.ico.after.arrow:hover:after {
    background-image: url(../img/contents/ico_arrow_green.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}
.button.gray.ico.before.arrow:before, .button.gray.ico.after.arrow:after {
    background-image: url(../img/contents/ico_back.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}
.button.gray.ico.before.arrow:hover:before, .button.gray.ico.after.arrow:hover:after {
    background-image: url(../img/contents/ico_back_gray.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}
.button.green.reverse{
    border-color: #00B2BB;
    background: #ffffff;
    color: #00B2BB;
}
.button.green.reverse:hover{
    border-color: #00B2BB;
    background: #00B2BB;
    color: #ffffff;
}
.button.green.reverse.black{
    color: #161616;
}
.button.green.reverse.black:hover{
    color: #fff;
}
.button.yellowGreen{
    border-color: #A4D16A;
    background: #A4D16A;
    color: #ffffff;
}
.button.yellowGreen:hover{
    border-color: #A4D16A;
    background: #ffffff;
    color: #A4D16A;
}
.button.yellowGreen.reverse{
    border-color: #A4D16A;
    background: #ffffff;
    color: #A4D16A;
}
.button.yellowGreen.reverse:hover{
    border-color: #A4D16A;
    background: #A4D16A;
    color: #ffffff;
}
.button.yellowGreen.dark{
    border-color: #95cb4d;
    background: #95cb4d;
    color: #000000;
}
/*.pageProperty.list .button.yellowGreen.dark,
.pageMember.entry .button.yellowGreen.dark {padding-left:0.5em; padding-right:0.5em;}*/

.button.yellowGreen.dark:hover{
    border-color: #95cb4d;
    background: #ffffff;
    color: #000000;
}

.button.pink {
    border-color: #F28AB9;
    background: #F28AB9;
    color: #ffffff;
}
.button.pink:hover{
    border-color: #F28AB9;
    background: #ffffff;
    color: #F28AB9;
}
.button.pink.reverse {
    border-color: #F28AB9;
    background: #ffffff;
    color: #F28AB9;
}
.button.pink.reverse:hover{
    border-color: #F28AB9;
    background: #F28AB9;
    color: #ffffff;
}
.button.pink.ico.before.arrow:before, .button.pink.ico.after.arrow:after {
    background-image: url(../img/contents/ico_back2.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    width: 1em;
    height: 1em;
    left: 2em;
}
.button.pink.ico.before.arrow:hover:before, .button.pink.ico.after.arrow:hover:after {
    background-image: url(../img/contents/ico_back2_pink.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
}

.button.reverse.fontBlock {
    color: #161616;
}



/* ====================================================
	ボタンボックス
==================================================== */
.buttonBox {
  text-align: center;
}
.buttonBox p {
  text-align: center;
}
.buttonBox li .button {
  display: block;
  padding: 0.75em;
  width: 100%;
}
.buttonBox.center .row {
  display: inline-block;
  width: 103%;
  max-width: 768px;
}
.buttonBox.center.single .row {
  max-width: 384px;
}

@media print, screen and (max-width: 767px) {
  .buttonBox > .row > .col-xs-12 {
    margin-top: 0.25em;
    margin-bottom: 0.25em;
  }
}
@media print, screen and (max-width: 991px) {
  .buttonBox > .row > .col-sm-12 {
    margin-top: 0.25em;
    margin-bottom: 0.25em;
  }
}
@media screen and (max-width: 1199px) {
  .buttonBox > .row > .col-md-12 {
    margin-top: 0.25em;
    margin-bottom: 0.25em;
  }
}
@media screen and (max-width: 9999px) {
  .buttonBox > .row > .col-lg-12 {
    margin-top: 0.25em;
    margin-bottom: 0.25em;
  }
}

/* ######################################################################################

　display　表示・非表示

###################################################################################### */
@media print, screen and (min-width: 768px) {
    div.pc, ul.pc, ol.pc, li.pc, dl.pc, dt.pc, dd.pc {
        display: block;
    }
    div.sp, ul.sp, ol.sp, li.sp, dl.sp, dt.sp, dd.sp {
        display: none;
    }

    span.pc, img.pc, em.pc, br.pc {
        display: inline;
    }
    span.sp, img.sp, em.sp, br.sp {
        display: none;
    }
}
@media screen and (max-width: 767px) {
    div.sp, ul.sp, ol.sp, li.sp, dl.sp, dt.sp, dd.sp {
        display: block;
    }
    div.pc, ul.pc, ol.pc, li.pc, dl.pc, dt.pc, dd.pc {
        display: none;
    }

    span.sp, img.sp, em.sp, br.sp {
        display: inline;
    }
    span.pc, img.pc, em.pc, br.pc {
        display: none;
    }
}




/* ######################################################################################

　form

###################################################################################### */
input[type="text"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="email"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="number"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.06);
  border: 1px solid #BABED1;
  border-radius: 4px;
    background-color: #ffffff;
    max-width: 100%;
  color: #16181B !important;
  font-family: "Noto Sans JP", "游ゴシック Medium", "YuGothic Medium", "游ゴシック", YuGothic, "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
}

label.select select,
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    box-shadow: inset 1px 1px 3px transparent;
  border: 1px solid #BABED1;
    border-radius: 4px;
    background-color: #ffffff;
    max-width: 100%;
  color: #16181B !important;
    font-family: "Noto Sans JP", "游ゴシック Medium", "YuGothic Medium", "游ゴシック", YuGothic, "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
}

@media print, screen and (min-width: 768px) {
  input[type="text"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="email"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="number"] {
    padding: 0.9em 1em;
    font-size: 1.6rem;
  }
  label.select select,
  textarea {
    padding: 1em;
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 767px){
  input[type="text"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="email"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="number"] {
    padding: 0.65em 0.75em;
    font-size: 1.6rem;
  }
  label.select select,
  textarea {
    padding: 0.65em 0.75em;
    font-size: 1.6rem;
  }
}


input[type="text"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="email"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="number"] {
    height: auto;
}

textarea {
    width: 100%;
  min-height: 12em;
}
label.select {
  position: relative;
}
label.select select {
  padding-right: 3em;
  line-height: 1.2;
}
label.select select:not([multiple]) {
  box-shadow: none;
  margin: 0;
}
label.select:after {
    content: "";
  display: inline-block;
  position: absolute;
  pointer-events: none;
  top: 22%;
  right: 1em;
  width: 7px;
  height: 7px;
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  transform: rotate(45deg);
}
label.select select::-ms-expand {
    display: none;
}
label.select option[disabled="disabled"] {
    background: #f0f0f0;
    color: #cccccc;
}

input-placeholder {
    color: #aaa !important;
}

::-webkit-input-placeholder {
    color: #aaa !important;
}

::-moz-placeholder {
    color: #aaa !important;
}

::-ms-input-placeholder {
    color: #aaa !important;
}

-webkit-input-placeholder {
    color: #aaa !important;
}

input:-ms-input-placeholder {
    color: #aaa !important;
}

-moz-placeholder {
    color: #aaa !important;
}

:-ms-input-placeholder {
    color: #aaa !important;
}

input[type="text"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="email"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="number"]:focus {
  border-color: #BABED1;
  background: #F5F8FA;
  box-shadow: none;
}

label.select select:focus,
textarea:focus {
  border-color: #BABED1;
  background: #F5F8FA;
  box-shadow: none;
}

select:not([multiple]):focus {
    box-shadow: none;
}

input + label, input + span {
    cursor: pointer;
}


/* ラジオボタン
-------------------------------------*/
input[type="radio"] {
  display: none;
}
input[type="radio"] + label,
input[type="radio"] + span {
    position: relative;
  padding-left: 28px;
  font-size: 1.4rem;
}
input[type="radio"] + label:before,
input[type="radio"] + span:before {
  content: "";
  display: inline-block;
  position: absolute;
}
input[type="radio"] + label:before,
input[type="radio"] + span:before {
  width: 20px;
  height: 20px;
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background: #fff;
  border-radius: 50%;
  border: 1px solid #BABED1;
}
input[type="radio"]:checked + label:before,
input[type="radio"]:checked + span:before{border: 1px solid #0060C1;}

input[type="radio"] + label:after,
input[type="radio"] + span:after {
    width: 10px;
    height: 10px;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 5px;
    transform: translateY(-50%);
    border-radius: 50%;
}
input[type="radio"]:checked + label:after, input[type="radio"]:checked + span:after {
  content: "";
  background: #0060C1;
}
input[type="radio"] + label, input[type="radio"] + span {
  cursor: pointer;
}
@media all and (-ms-high-contrast: none) {/* IE */
  input[type="radio"] + label:before,
  input[type="radio"] + span:before {
    transform: translateY(-60%);
  }
  input[type="radio"] + label:after,
  input[type="radio"] + span:after {
    transform: translateY(-70%);
  }
}

.mw_wp_form form .mwform-radio-field + .mwform-radio-field {
    margin-left: 1.5em;
}




/* チェックボタン
-------------------------------------*/
input[type="checkbox"] {
  display: none;
}

input[type="checkbox"] + label,
input[type="checkbox"] + span {
    position: relative;
  display: inline-block;
  padding-left: 2.25em;
  font-weight: normal;
}
input[type="checkbox"] + label:before, input[type="checkbox"] + span:before{
    content: "";
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 0.25em;
    transform: translateY(-50%);
  }
  input[type="checkbox"] + label:before, input[type="checkbox"] + label:after, input[type="checkbox"] + span:before, input[type="checkbox"] + span:after{
    width: 1em;
    height: 1em;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}
  input[type="checkbox"] + label:before, input[type="checkbox"] + label:after, input[type="checkbox"] + span:before, input[type="checkbox"] + span:after{
    width: 1em;
    height: 1em;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
  }
  input[type="checkbox"] + label:before, input[type="checkbox"] + span:before {
    content: "";
    border-radius: 4px;
    background-color: #fff;
    border: 1px solid #BABED1;
    width: 1.5em;
    height: 1.5em;
  }
  input[type="checkbox"]:checked + label:after, input[type="checkbox"]:checked + span:after {
    content: "";
    background: url(../img/contents/ico-check.svg) center no-repeat;
    background-size: 100%;
    background-color: #00B2BB;
    width: 1.5em;
    height: 1.5em;
    background-size: 60%;
    border-radius: 4px;
}
  input[type="checkbox"] + label, input[type="checkbox"] + span {
    cursor: pointer;

}




/* ファイルを選択
-------------------------------------*/
.mw_wp_form input[type="file"]::file-selector-button {
    font-weight: normal;
    color: #333333;
    background: #EFEFEF;
    border: 1px solid #767676;
    font-size: 1.4rem;
    border-radius: 4px;
    padding: 0.5em 0.75em;
    text-align: center;
}



/* ====================================================
    プライバシーポリシー
==================================================== */
.privacyPolicyBox .scroll {
    overflow-y: scroll;
}
.privacyPolicyBox .scroll .privacyInner{
    background: #f5f5f5;
}
.privacyPolicyBox .scroll .privacyTitle{
    font-weight: bold;
}

@media print, screen and (min-width: 768px) {
    .privacyPolicyBox .scroll {height: 255px;}
    .privacyPolicyBox .scroll .privacyInner{padding: 2.25em 2.5em;}
    .privacyPolicyBox .scroll .privacyTitle{margin-top: 2em; margin-bottom: 0.6em; font-size: 1.5rem;}
    .privacyPolicyBox .scroll .privacyTitle:first-child{margin-top: 0;}
    .privacyPolicyBox .scroll p{font-size: 1.2rem;}
}
@media screen and (max-width: 767px) {
    .privacyPolicyBox .scroll {height: 220px;}
    .privacyPolicyBox .scroll .privacyInner{padding: 1.75em 1.5em;}
    .privacyPolicyBox .scroll .privacyTitle{margin-top: 1.75em; margin-bottom: 0.5em; font-size: 1.4rem;}
    .privacyPolicyBox .scroll .privacyTitle:first-child{margin-top: 0;}
    .privacyPolicyBox .scroll p{font-size: 1.2rem;}
}

/* ====================================================
    同意する
==================================================== */
.agreementBox {
    text-align: center;
}
.agreementBox label{
    display: inline-block;
    cursor: pointer;
}
.agreementBox label span{
    font-size: 1.5rem;
    font-weight: bold;
}
.agreementBox + .buttonBox {
    margin-top: 2em;
}
@media print, screen and (min-width: 768px) {
    .agreementBox {margin-top: 2em; margin-bottom: 2.5em;}
    .agreementBox p:last-of-type{margin-bottom: 1.5em; font-size: 1.5rem;}
    .agreementBox label span{font-size: 1.5rem;}
}
@media screen and (max-width: 767px) {
    .agreementBox {margin-top: 2em; margin-bottom: 3em;}
    .agreementBox p:last-of-type{margin-bottom: 1.5em; font-size: 1.4rem;}
    .agreementBox label span{font-size: 1.4rem;}
}


/* ====================================================
　入力枠サイズ
==================================================== */
.size-input-ss{width: 9.8em;}
.size-input-s{width: 15em;}
.size-input-m{width: 27em;}
.size-input-l{width: 38em;}
.size-input-full{width: 100%;}

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



/* ====================================================
    住所
==================================================== */
.addressBox{}
.addressBox__item + .addressBox__item{margin-top: 0.75em;}
.addressBox__item .search{margin-left: 1em; text-decoration: none; color: #1381D6;}
.addressBox__item .search:before{
    content: "";
    position: relative;
    top: 0.2em;
    display: inline-block;
    margin-right: 0.25em;
    width: 1.2em;
    height: 1.2em;
    background-image: url(../img/contents/ico_q.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}


/* ====================================================
    ご提出書類
==================================================== */
.wallBelt.form .formUpload{
    border-top: 1px solid #DAE1E7;
    border-bottom: 1px solid #DAE1E7;
}
.wallBelt.form .formUpload + .formUpload{
    border-top: none;
}
.wallBelt.form .formUpload .title{
    margin-bottom: 0.25em;
    font-weight: bold;
}
.wallBelt.form .formUpload .text{
    margin-bottom: 0;
}
.wallBelt.form .formUpload p a{
    color: #1381D6;
    text-decoration: underline;
}
@media print, screen and (min-width: 768px) {
    .wallBelt.form .formUpload{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1.75em 0;
    }
    .wallBelt.form .formUpload .title{
        font-size: 1.5rem;
    }
    .wallBelt.form .formUpload .text{
        font-size: 1.3rem;
    }
    .wallBelt.form .formUpload p a{
        font-size: 1.6rem;
    }
    .wallBelt.form .formUpload p a:hover{
        text-decoration: none;
    }
}
@media screen and (max-width: 767px) {
    .wallBelt.form .formUpload{
        padding: 1.25em 0;
    }
    .wallBelt.form .formUpload .title{
        font-size: 1.4rem;
    }
    .wallBelt.form .formUpload .text{
        font-size: 1.2rem;
    }
    .wallBelt.form .formUpload p a{
        font-size: 1.5rem;
    }
    .wallBelt.form .formUpload dt{
        margin-bottom: 1em;
    }
}


/* ====================================================
    必須
==================================================== */
.formUpload .required:after,
form th.required:after {
  content: "必須";
  display: inline-block;
  vertical-align: middle;
  position: relative;
  background: #DC0000;
  border-radius: 3px;
  padding: 0.45em 0.5em;
  margin-left: 1em;
  vertical-align: middle;
  line-height: 1;
  color: #ffffff;
  font-weight: bold;
}

@media print, screen and (min-width: 768px) {
    .formUpload .required:after,
    form th.required:after {
        font-size: 1.1rem;
        top: -0.15em;
}
}
@media screen and (max-width: 767px) {
    .formUpload .required:after,
    form th.required:after {
        font-size: 1.0rem;
        top: -0.1em;
    }
}



/* ====================================================
    エラー
==================================================== */
.mw_wp_form form .error,
form .error {
    display: block;
  margin: 0.5em 0 0;
  padding-left: 1em;
  text-indent: -1em;
  line-height: 1;
  font-size: 1.4rem;
  color: #DC0000;
  font-weight: normal;
}
.mw_wp_form form .error:before,
form .error:before {
  content: "※";
}

.mw_wp_form_send_error{
    margin-bottom: 3em;
    padding: 1.5em;
    background: #FFF0F0;
    border: 1px solid #DC0000;
    border-radius: 3px;
    color: #DC0000;
}


/* ====================================================
    フォーム枠
==================================================== */
.wallBelt.form .contents{
    max-width: 930px;
}
.wallBelt.form .borderHorizon th{font-weight: normal;}

@media print, screen and (min-width: 768px) {
    .wallBelt.form{
        padding-bottom: 120px;
    }
    .wallBelt.form .titleBold.large{
        margin-bottom: 1em;
        font-size: 2.6rem;
    }
    .wallBelt.form .titleBold.small{
        margin-top: 3.5em;
        margin-bottom: 1em;
        font-size: 1.8rem;
    }
    .wallBelt.form .leadText{
        margin-bottom: 3.5em;
        text-align: center;
        font-size: 1.5rem;
        line-height: 1.86;
    }
    .wallBelt.form p{
        margin-bottom: 1.5em;
        font-size: 1.5rem;
        line-height: 1.86;
    }
    .wallBelt.form .grayText{
        background: #F7F7F7;
        padding: 1.5em;
    }
}
@media screen and (max-width: 767px) {
    .wallBelt.form{
        padding-bottom: 80px;
    }
    .wallBelt.form .titleBold.large{
        margin-bottom: 1em;
        font-size: 2.0rem;
    }
    .wallBelt.form .titleBold.small{
        margin-top: 3em;
        margin-bottom: 0.75em;
        font-size: 1.6rem;
    }
    .wallBelt.form .leadText{
        margin-bottom: 2.5em;
        font-size: 1.5rem;
        line-height: 1.86;
    }
    .wallBelt.form p{
        margin-bottom: 1.5em;
        font-size: 1.4rem;
        line-height: 1.86;
    }
    .wallBelt.form .grayText{
        background: #F7F7F7;
        padding: 1.5em;
    }
}




/* ====================================================
    入力画面
==================================================== */
.mw_wp_form_input .icon_zip,
.mw_wp_form_input .buttonBox__item.send,
.mw_wp_form_input .buttonBox__item.back{display: none;}

.mw_wp_form_input .buttonBox li {width: 100%;}
.mw_wp_form_input .buttonBox li .button{
    display: inline-block;
    width: auto;
    padding: 1.5em;
}

@media print, screen and (min-width: 768px) {
    .mw_wp_form_input .borderHorizon th{padding-top: 1.85em; padding-bottom: 1.85em;}
    .mw_wp_form_input .borderHorizon td{padding-top: 1em; padding-bottom: 1em;}
}
@media screen and (max-width: 767px) {
}


/* ====================================================
    確認画面
==================================================== */
.mw_wp_form_confirm label.select:after,
.mw_wp_form_confirm .addressBox__item .search,
.mw_wp_form_confirm .sample,
.mw_wp_form_confirm .mail_confirm,
.mw_wp_form_confirm .privacyPolicyBox,
.mw_wp_form_confirm .agreementBox,
.mw_wp_form_confirm .buttonBox__item.conf,
.mw_wp_form_confirm .formUpload .text,
.mw_wp_form_confirm .formUpload .required:after,
.mw_wp_form_confirm form th.required:after{display: none;}

.mw_wp_form_confirm .formNameList{justify-content: flex-start;}
.mw_wp_form_confirm .formNameList__item{width: auto;}

.mw_wp_form_confirm th,
.mw_wp_form_confirm td{line-height: 1.75;}

.mw_wp_form_confirm .buttonBox{
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
}
.mw_wp_form_confirm .buttonBox li .button{
    display: inline-block;
    width: auto;
    padding: 1.5em;
}



@media print, screen and (min-width: 768px) {
  .mw_wp_form_confirm .buttonBox li {padding: 0 1em;}
  .mw_wp_form_confirm .buttonBox li .button{min-width: 230px; display: inline-block;}
}
@media screen and (max-width: 767px) {
  .mw_wp_form_confirm .buttonBox {justify-content: space-between;}
  .mw_wp_form_confirm .buttonBox li {width: 49%;}
  .mw_wp_form_confirm .buttonBox li .button{
    width: 100%;
    max-width: 100%;
    min-width: auto;
    padding-left: 1em!important;
    padding-right: 1em!important;
  }
}


/* ====================================================
    完了画面
==================================================== */
.fotmmailer.thanks p.company{
  background: #F7F7F7;
  padding: 1.5em;
  margin-bottom: 0;
}

@media print, screen and (min-width: 768px) {
  .fotmmailer.thanks .titleBold{margin-bottom: 2em;}
  .fotmmailer.thanks p{
    margin-bottom: 2em;
    max-width: 700px;
    font-size: 1.5rem;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .fotmmailer.thanks p{margin-bottom: 1.5em;}
}



/* ######################################################################################

　columnswrap

###################################################################################### */
@media print, screen and (min-width: 768px) {
    .columnswrap{
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .columnswrap__main{
        width: 74.19%;
    }
    .columnswrap__sub{
        width: 19.35%;
    }
}
@media screen and (max-width: 767px) {
    .columnswrap{
        display: block;
    }
    .columnswrap__main,
    .columnswrap__sub{
        width: 100%;
    }
    .columnswrap__sub + .columnswrap__main,
    .columnswrap__main + .columnswrap__sub{
        margin-top: 3em;
    }
}



/* ######################################################################################

　アクセシビリティ対応　sr-only

###################################################################################### */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}


/* ######################################################################################

　ハンバーガーメニュー：meanMenu

###################################################################################### */
/* ====================================================
　3＠デフォルト　※基本的には変更しない
==================================================== */
/* ＋－のはみ出し防止 */
.meanMenuAcc ul li,
.mean-container .mean-nav ul li {
    position: relative;
    z-index: 10;
}

.meanMenuAcc ul li a.meanAcc-expand,
.mean-container .mean-nav ul li button.mean-expand {
    background: none !important;
    border: none !important;
}

.mean-container .mean-bar {
    padding: 0;
    min-height: 0;
}

.header {
    width: 100%;
    position: relative;
}

.mean-container .mean-bar {
    height: 0;
}

.meanMenuAcc ul li a,
.mean-container .mean-nav ul li a {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

/* 重なり順 DF
-------------------------------------*/
.header {
    z-index: 9999;
}

.mean-bar {
    z-index: 10000;
}

/* ×スタイル DF
-------------------------------------*/
.mean-container button.meanmenu-reveal.meanclose span:nth-of-type(1) {
    transform: rotate(45deg);
}

.mean-container button.meanmenu-reveal.meanclose span:nth-of-type(2) {
    opacity: 0;
}

.mean-container button.meanmenu-reveal.meanclose span:nth-of-type(3) {
    transform: rotate(-45deg);
}

/* ＋・－　スタイル DF
-------------------------------------*/
.meanMenuAcc ul li a.meanAcc-expand,
.mean-container .mean-nav ul li button.mean-expand {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0px !important;
}

.meanMenuAcc ul li a.meanAcc-expand:before,
.meanMenuAcc ul li a.meanAcc-expand:after,
.mean-container .mean-nav ul li button.mean-expand:before,
.mean-container .mean-nav ul li button.mean-expand:after {
    content: "";
    display: block;
    position: relative;
}

.meanMenuAcc ul li a.meanAcc-expand:after,
.mean-container .mean-nav ul li button.mean-expand:after {
    transform: rotate(90deg);
}

.meanMenuAcc ul li a.meanAcc-expand.meanAcc-clicked:after,
.mean-container .mean-nav ul li button.mean-expand.mean-clicked:after {
    display: none;
}

/* スクロール対応 DF
-------------------------------------*/
.meanmenu-reveal.meanclose + .mean-nav {
    box-sizing: border-box;
    transition: height ease 0.3s;
    max-height: calc(100vh - 64px);
    /* 100% からヘッダの高さを引く*/
    overflow-y: scroll;
}

/* mmOpen時にbodyのスクロールを止める DF
-------------------------------------*/
/*
    html.mmOpen,
    html.mmOpen body {overflow: auto; height: 100%;}
    html.mmOpen body {overflow: hidden;}
*/

/* meanMenuAcc DF
-------------------------------------*/
.meanMenuAcc ul li a {
    display: block;
    border-top: 1px solid #383838;
    text-decoration: none;
    text-transform: uppercase;
}

.meanMenuAcc ul {
    position: relative;
    z-index: 10;
}

.meanMenuAcc ul li {
    position: relative;
    float: left;
    width: 100%;
}

.meanMenuAcc ul li a.meanAcc-expand {
    position: absolute;
    z-index: 2;
    right: 0;
    top: 0;
    margin-top: 1px;
    text-align: center;
}

/* #####################  ここから　meanMenu　個別設定  ##################### */
/* =========================================================
  PC対応  ※PCで使用する場合は削除
          ※[meanScreenWidth] に大きめの値を設定
========================================================= */
@media print, screen and (min-width: 768px) {
    .meanMenu {
        display: none !important;
    }
}
@media screen and (max-width: 767px) {
    /* =========================================================
    　ヘッダ固定  ※固定にしない場合は削除
    ========================================================= */
    header,
    .mean-container .mean-bar {
        position: fixed !important;
    }

    /* =========================================================
    　ヘッダ高さ  ※[meanNavPush]にも設定
    ========================================================= */
    .header .contents {
        height: 65px;
    }

    .mean-container .mean-nav {
        margin-top: 65px;
    }

    /* ====================================================
    　ヘッダスタイル
    ==================================================== */
    .header .contents {
        background: #fff;
        box-shadow: none;
    }
}

/* ====================================================
　≡ボタン
==================================================== */
.mean-container button.meanmenu-reveal {
    width: 65px;
    height: 65px;
    padding: 0;
    background: #00B2BB;
}

.mean-nav ul li li > a:not(fitst-of-child) {
    opacity: 1 !important;
}

/* ====================================================
　≡スタイル
==================================================== */
.mean-container button.meanmenu-reveal {

}
.mean-container button.meanmenu-reveal span {
    position: relative;
    top: 7px;
    /* ≡の位置調整 */
    width: 30%;
    /* ≡の長さ */
    background: #fff;
    /* ≡の色 */
    height: 2px;
    /* ≡の太さ */
    margin: 4px auto;
    /* ≡の間隔 */
}
.mean-container button.meanmenu-reveal em {
    text-align: center;
    font-size: 1.1rem;
    font-style: normal;
}
.mean-container button.meanmenu-reveal span:nth-of-type(3) {
    margin-bottom: 11px;
}

/* ====================================================
　×スタイル
==================================================== */
.mean-container button.meanmenu-reveal.meanclose span {
    top: 22px;
    /* ×の位置調整 */
    left: 23px;
    /* ×の位置調整 */
    width: 40%;
    /* ×の長さ */
    background: #fff;
    /* ×の色 */
    height: 2px;
    /* ×の太さ */
}
.mean-container button.meanmenu-reveal.meanclose em {
    position: relative;
    top: 1em;
}

/* ====================================================
　メニュースタイル
==================================================== */
.mean-container .mean-nav {
    background: #00B2BB;
}
.mean-container .mean-nav > ul{
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
}
.mean-container .mean-nav > ul > li:first-child{
    margin-top: 1em;
    box-sizing: border-box;
}
.mean-container .mean-nav > ul > li:last-child{
    margin-bottom: 6em;
    box-sizing: border-box;
}

/* メニュー色 */
.mean-container .mean-nav ul li a {
    width: 100%;
    border-top-color: #fff !important;
    /* 区切り線上 */
    border-bottom-color: #fff !important;
    /* 区切り線下 */
    padding: 1.2em 60px 1.15em 0 !important;
    /* ボタン余白 */
    color: #fff;
    /* 文字色 */
    font-size: 1.5rem;
    font-weight: bold;
}

.mean-container .mean-nav > ul > li:first-child > a {
    border-top-width: 0;
}
.mean-container .mean-nav > ul > li:last-child {
    border-bottom: 1px solid #fff;
}
.mean-container .mean-nav ul li ul li a{
    width: 100%;
    padding: 0.5em 0 0.5em 0 !important;
    font-size: 1.4rem;
    font-weight: normal;
    border: none!important;
}
.mean-container .mean-nav ul li ul li:first-child a{
    padding-top: 0!important;
}
.mean-container .mean-nav ul li ul li:last-child{
    padding-bottom: 1em!important;
}


/* 下端の罫線 */
/* ====================================================
　＋・－　スタイル
==================================================== */
.mean-container .mean-nav ul li button.mean-expand {
    background: transparent !important;
    width: 100%;
    height: 3.2em;
    border: none !important;
    top: 0;
}

.mean-container .mean-nav ul li button.mean-expand:before,
.mean-container .mean-nav ul li button.mean-expand:after {
    position: absolute;
    right: 1em;
    background: #fff;
    /* ＋－の色 */
    width: 4%;
    /* ＋－の間隔 */
    height: 2px;
    /* ＋－の太さ */
}
.mean-container .mean-nav ul li button:hover{
    background: none;
}

.mean-container .mean-nav ul li button.mean-expand:before {
    top: 48%;
}

/* －の位置調整 */
.mean-container .mean-nav ul li button.mean-expand:after {
    top: 48%;
}

/* ｜の位置調整 */

/* フッタリンク：ログイン・ログアウト
.mean-nav li.login,
.mean-nav li.logout {display:none;}

body:not(.logged-in) .mean-nav li.login {display: inline-block;}
body.logged-in .mean-nav li.logout {display: inline-block;}
 */



/* フッタリンク：ログイン・ログアウト
.mean-nav li.login,
.mean-nav li.logout {display:none;}

body:not(.logged-in) .mean-nav li.login {display: inline-block;}
body.logged-in .mean-nav li.logout {display: inline-block;}
 */








/* ######################################################################################

    pageTop：ページトップ

###################################################################################### */
.pageTopFix{
    position: fixed;
    background-color: #00B2BB;
    z-index: 8000;
    cursor: pointer;
    text-indent: -99999px;
    border-radius: 50%;
}
.pageTopFix:before{
    content: "";
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
}

@media print, screen and (min-width: 768px) {
    .pageTopFix{
        bottom: 70px;
        right: 50px;
        width: 60px;
        height: 60px;
    }
    .pageTopFix:before{
        width: 12px;
        height: 12px;
    }
}
@media screen and (max-width: 767px) {
    .pageTopFix{
        bottom: 50px;
        right: 15px;
        width: 50px;
        height: 50px;
    }
    .pageTopFix:before{
        width: 12px;
        height: 12px;
    }
}
@media print{
    .pageTopFix{
        display: none!important;
    }
}


/* ######################################################################################

  タブ　tab

###################################################################################### */
.tabListsBox{
    position: relative;
    z-index: 1;
}
.tabLists{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.tabLists__item{
    position: relative;
    text-align: center;
    font-weight: bold;
    color: #8F8F8F;
    background: #fff;
    cursor: pointer;
}
.tabLists__item:hover{background: #f2f2f2;}
.tabLists__item:nth-child(1).select{background: #00B2BB; color: #ffffff;}
.tabLists__item:nth-child(2).select{background: #A4D16A; color: #ffffff;}
.tabLists__item:nth-child(3).select{background: #FB9E57; color: #ffffff;}

.tabContents__item{
    display: none;
}
.tabContents__item.select{
    position: relative;
    display: block;
}

@media print, screen and (min-width: 768px) {
    .tabListsBox{
        margin-top: -5.6em;
    }
    .tabLists__item{
        width: calc(calc(100% - 40px) / 3);
        padding: 1.25em 0;
        font-size: 2rem;
        border-radius: 8px 8px 0 0;
    }
    .tabLists__item.select:before{
        content: "";
        display: block;
        position: absolute;
        bottom: -18px;
        left: calc(50% - 10px);
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
    }
    .tabLists__item:nth-child(1).select:before{border-top: 15px solid #00B2BB;}
    .tabLists__item:nth-child(2).select:before{border-top: 15px solid #A4D16A;}
    .tabLists__item:nth-child(3).select:before{border-top: 15px solid #FB9E57;}

    .tabContents__item{padding: 4em 0 6em;}
    .tabContents__item:nth-child(1).select{border-top: 6px solid #00B2BB;}
    .tabContents__item:nth-child(2).select{border-top: 6px solid #A4D16A;}
    .tabContents__item:nth-child(3).select{border-top: 6px solid #FB9E57;}
}
@media screen and (max-width: 767px) {
    .tabListsBox{
        margin-top: -4.1em;
    }
    .tabListsBox .contents{
        padding: 0;
    }
    .tabLists__item{
        width: calc(calc(100% - 5px) / 3);
        padding: 1.25em 0;
        font-size: 1rem;
        color: #333333;
        border-radius: 4px 4px 0 0;
    }

    .tabContents__item{padding: 2.5em 0 4em;}
    .tabContents__item:nth-child(1).select{border-top: 4px solid #00B2BB;}
    .tabContents__item:nth-child(2).select{border-top: 4px solid #A4D16A;}
    .tabContents__item:nth-child(3).select{border-top: 4px solid #FB9E57;}
}





/* ######################################################################################

　テーブル　table 表

###################################################################################### */
table{
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

/* ====================================================
　罫線色
==================================================== */
th,td,td:before {border-color: #DAE1E7;}

/* ====================================================
　見出しセル
==================================================== */
th, td:before {
    background: transparent;
    vertical-align: top;
    text-align: left;
}
th[scope="row"],
td:before {width:6em;}

/* ====================================================
　文字サイズ
==================================================== */
@media print, screen and (min-width: 768px) {
    table,th,td {font-size:1.5rem;}
}
@media screen and (max-width: 767px) {
    table,th,td {font-size:1.4rem;}
}

/* ====================================================
　セル余白
==================================================== */
@media print, screen and (min-width: 768px) {
    th,td {padding: 1.5em 1em;}
}
@media screen and (max-width: 767px) {
    th,td {padding: 0.8em 1em;}
    .borderHorizon th{padding: 1em 0 0.5em 0;}
    .borderHorizon td{padding: 0 0 1em 0;}
}


/* ====================================================
　罫線タイプ
==================================================== */
/* 水平線
-------------------------------------*/
.borderHorizon th,
.borderHorizon td { border-width: 1px 0; }

.borderHorizon tr:not(:first-child) th,
.borderHorizon tr:not(:first-child) td {border-top-width:0;}

@media print, screen and (min-width: 768px) {
  .borderHorizon th{width: 250px; padding-left: 0.5em;}
}

/* ====================================================
　線種
==================================================== */
.borderSolid th { border-style: solid; }
.borderSolid td { border-style: solid; }
.borderSolid td:before { border-style: solid; }
.borderDotted th { border-style: dotted; }
.borderDotted td { border-style: dotted; }
.borderDotted td:before { border-style: dotted; }
.borderDashed th { border-style: dashed; }
.borderDashed td { border-style: dashed; }
.borderDashed td:before { border-style: dashed; }

@media screen and (max-width: 767px) {
    table.xs-block,
    table.xs-block caption,
    table.xs-block thead,
    table.xs-block tbody,
    table.xs-block tr,
    table.xs-block th,
    table.xs-block td { display: block; width:100%; }

    table.xs-block th:not(:first-child),
    table.xs-block td:not(:first-child) {border-top-width:0 !important;}
    table.xs-block tr:not(:first-child) th,
    table.xs-block tr td {border-top-width: 0;}
    table.xs-block tr th{border-bottom-width: 0;}

    table.borderBox.xs-block th:not(:first-child),
    table.borderBox.xs-block td:not(:first-child) {border-left-width:1px;}

    table.cell-xs-create th { display: none; }
    table.cell-xs-create td {
        position: relative;
        overflow: hidden;
    }
    table.cell-xs-create td:before { content: attr(title); }
}





/* ######################################################################################

  タイトル　title

###################################################################################### */
/* ====================================================
　titlePokey
==================================================== */
.titlePokey{
    position: relative;
    margin-bottom: 1em;
    padding-bottom: 0.6em;
    border-bottom: 2px solid #ddd;
    color: #333;
}
.titlePokey:before{
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 70px;
    height: 2px;
    margin-right: 0.5em;
    background: #00B2BB;
    vertical-align: middle;
}
/* ====================================================
　titlePokey 色違い　#A4D16A　黄緑
==================================================== */
.titlePokey.yellowGreen{
    position: relative;
    margin-bottom: 1em;
    padding-bottom: 0.6em;
    border-bottom: 2px solid #ddd;
    color: #333;
}
.titlePokey.yellowGreen:before{
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 70px;
    height: 2px;
    margin-right: 0.5em;
    background: #A4D16A;
    vertical-align: middle;
}

.titlePokey.bold{
    font-weight: bold;
}
@media print, screen and (min-width: 768px) {
    .titlePokey{
        font-size: 2.4rem;
    }
    .titlePokey.small{
        font-size: 2rem;
    }
    .titlePokey.mini{
        font-size: 1.8rem;
    }
    .titlePokey.pbWide {
        padding-bottom: 13px;
    }
    .titlePokey.long:before{
        width: 144px;
    }
}
@media screen and (max-width: 767px) {
    .titlePokey{
        font-size: 1.8rem;
    }
    .titlePokey.small{
        font-size: 1.5rem;
    }
    .titlePokey.mini{
        font-size: 1.5rem;
    }
}

/* 色 */
.titlePokey.orange:before{
    background: #FB9E57;
}
.titlePokey.pink:before{
    background: #F28AB9;
}


/* ====================================================
　titleUnderLineCenter
==================================================== */
.titleUnderLineCenter{
    position: relative;
    text-align: center;
    font-weight: bold;
}
.titleUnderLineCenter:before{
    content: "";
    display: inline-block;
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 40px;
    height: 2px;
    transform: translateX(-50%);
    background: #00B2BB;
    vertical-align: middle;
}
@media print, screen and (min-width: 768px) {
    * + .titleUnderLineCenter{
        margin-top: 2em;
    }
    .titleUnderLineCenter{
        margin-bottom: 0.75em;
        padding-bottom: 0.75em;
        font-size: 3.2rem;
    }
    .titleUnderLineCenter.small{
        font-size: 2.6rem;
    }
}
@media screen and (max-width: 767px) {
    * + .titleUnderLineCenter{
        margin-top: 2.5em;
    }
    .titleUnderLineCenter{
        margin-bottom: 0.75em;
        padding-bottom: 0.75em;
        font-size: 2.2rem;
    }
    .titleUnderLineCenter.small{
        font-size: 2.0rem;
    }
}

/* ====================================================
　titleBold
==================================================== */
.titleBold{
    font-weight: bold;
}
@media print, screen and (min-width: 768px) {
    .titleBold{
        font-size: 2rem;
    }
    .titleBold.middle{
        font-size: 2.4rem;
    }
    .titleBold.large{
        font-size: 2.8rem;
    }
    .titleBold.small{
        font-size: 1.4rem;
    }
}
@media screen and (max-width: 767px) {
    .titleBold{
        font-size: 1.8rem;
    }
    .titleBold.small{
        font-size: 1.4rem;
    }
}

/* blue */
* + .titleBold.blue{margin-top: 2em;}
.titleBold.blue{margin-bottom: 0.75em; color: #5366AC;}
.titleBold.blue .black{display: inline-block; margin-left: 0.5em; color: #161616;}

.grayText .titleBold.blue{margin-bottom: 0.25em;}

@media print, screen and (min-width: 768px) {
}
@media screen and (max-width: 767px) {
}


/* ====================================================
　titleBg
==================================================== */
.titleBg{
    background: #fff;
}
.titleBg .logo img{
    max-width: 200px;
}

@media print, screen and (min-width: 768px) {
    .titleBg{
        margin-bottom: 4.5em;
        padding: 1.5em 0;
    }
    .titleBg .contents{
        display: flex;
        align-items: center;
    }
    .titleBg .bold{
        margin-left: 0.75em;
        font-size: 3.2rem;
    }
}
@media screen and (max-width: 767px) {
    .titleBg{
        margin-bottom: 3em;
        padding: 1em 0;
    }
    .titleBg .logo{
        margin-bottom: 0.25em;
        display: block;
        text-align: center;
    }
    .titleBg .logo img{
        margin-bottom: 0;
    }
    .titleBg .bold{
        display: block;
        text-align: center;
        font-size: 1.8rem;
    }
}


/* pink */
.titleBg.pink{
    background: #F7E9EA;
}
@media print, screen and (min-width: 768px) {
    * + .titleBg.pink{
        margin-top: 3.5em;
    }
    .titleBg.pink{
        margin-bottom: 1.25em;
        padding: 1em 1.25em;
        font-size: 1.6rem;
    }
}
@media screen and (max-width: 767px) {
    * + .titleBg.pink{
        margin-top: 3em;
    }
    .titleBg.pink{
        margin-bottom: 1.25em;
        padding: 0.85em 1em;
        font-size: 1.5rem;
    }
}

/* blue */
.titleBg.blue{
    background: #5366AC;
    color: #fff;
    padding: 0.25em 1em;
    margin-bottom: 0.75em;
}
.titleBg.blue .small{
    margin-top: 0.25em;
    display: inline-block;
    font-size: 80%;
    line-height: 1.35;
}

@media print, screen and (min-width: 768px) {
    .titleBg.blue{font-size: 1.4rem;}
}
@media screen and (max-width: 767px) {
    .titleBg.blue{font-size: 1.3rem;}
}

/* large */
@media print, screen and (min-width: 768px) {
    .titleBg.large{font-size: 1.6rem;}
}
@media screen and (max-width: 767px) {
    .titleBg.large{font-size: 1.5rem;}
}

/* mb0 */
@media print, screen and (min-width: 768px) {
    .titleBg.mb0{margin-bottom: 0;}
}
@media screen and (max-width: 767px) {
    .titleBg.mb0{margin-bottom: 0;}
}


/* ====================================================
　titleNumber
==================================================== */
* + .titleNumber{margin-top: 1.5em;}
.titleNumber{
    padding-left: 2em;
    margin-bottom: 0.75em;
    position: relative;
    font-size: 1.6rem;
    font-weight: bold;
}
.titleNumber.noNum{
    padding-left: 0;
}
.titleNumber .num{
    position: absolute;
    left: 0;
    top: 0;
    width: 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
}
@media print, screen and (min-width: 768px) {
    .titleNumber{font-size: 1.6rem;}
}
@media screen and (max-width: 767px) {
    .titleNumber{font-size: 1.5rem;}
}

/* ====================================================
　titleIcon
==================================================== */
* + .titleIcon{margin-top: 1.5em;}
.titleIcon{
    padding-left: 1.5em;
    margin-bottom: 0.5em;
    position: relative;
    font-size: 1.6rem;
    font-weight: bold;
}
.titleIcon .icon{
    position: absolute;
    left: 0;
    top: 0;
    width: 1.25em;
    height: 1.25em;
    margin-right: 0.5em;
}
@media print, screen and (min-width: 768px) {
    .titleIcon{font-size: 1.6rem;}
    .titleIcon .icon{top: -0.25em;}
}
@media screen and (max-width: 767px) {
    .titleIcon{font-size: 1.5rem;}
    .titleIcon .icon{top: 0.35em;}
}


/* ====================================================
    titleBorder
==================================================== */
.titleBorder{
    margin-bottom: 0.5em;
}
.titleBorder span{
    padding: 0 0.5em;
    display: inline-block;
    border: 1px solid #000;
    border-radius: 3px;
    background: #fff;
    font-weight: normal;
}
@media print, screen and (min-width: 768px) {
    .titleBorder{font-size: 1.3rem;}
}
@media screen and (max-width: 767px) {
    .titleBorder{font-size: 1.3rem;}
}

/* ====================================================
    leftLineTitle
==================================================== */
.leftLineTitle {
    position: relative;
    border-bottom: 1px solid #EAEAEA;
}
.leftLineTitle:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 15px;
    height: 1px;
    background: #00B2BB;
}

@media print, screen and (min-width: 768px) {
    .leftLineTitle {
        padding-bottom: 0.5em;
        font-size: 1.8rem;
    }
}
@media screen and (max-width: 767px) {
    .leftLineTitle {
        padding-bottom: 0.5em;
        font-size: 1.6rem;
    }
}

/* ====================================================
    centerTitle
==================================================== */
.centerTitle {
    position: relative;
    text-align: center;
}
.centerTitle:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 40px;
    height: 2px;
    background: #00B2BB;
}

@media print, screen and (min-width: 768px) {
    .centerTitle {
        padding-bottom: 22px;
        font-size: 2.6rem;
    }
}
@media screen and (max-width: 767px) {
    .centerTitle {
        padding-bottom: 1em;
        font-size: 1.8rem;
    }
}

/* ====================================================
    topBorderTitle
==================================================== */
.topBorderTitle {
    position: relative;
}
.topBorderTitle:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 40px;
    height: 2px;
    background: #00B2BB;
}

@media print, screen and (min-width: 768px) {
    .topBorderTitle {
        padding-top: 1em;
        font-size: 2.2rem;
    }
}
@media screen and (max-width: 767px) {
    .topBorderTitle {
        padding-top: 0.75em;
        font-size: 1.6rem;
    }
}

/* ====================================================
    boldTitle
==================================================== */
.boldTitle {
    font-weight: bold;
}
.boldTitle.center {
    text-align: center;
}
@media print, screen and (min-width: 768px) {
    .boldTitle {
        margin-bottom: 2em;
        font-size: 2.4rem;
    }
    .boldTitle.mid {
        font-size: 1.8rem;
    }
    .boldTitle.large {
        font-size: 2.6rem;
    }
}
@media screen and (max-width: 767px) {
    .boldTitle {
        margin-bottom: 2em;
        font-size: 1.8rem;
    }
    .boldTitle.mid {
        font-size: 1.6rem;
    }
    .boldTitle.large {
        font-size: 2rem;
    }
}

/* ====================================================
    borderbottomTitle
==================================================== */
.borderbottomTitle {
    position: relative;
    border-bottom: 1px solid #F2F4F5;
}
.borderbottomTitle.leftBorder:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 28px;
    background: #00B2BB;
}
@media print, screen and (min-width: 768px) {
    .borderbottomTitle {
        padding: 0 0 13px 14px;
        font-size: 1.8rem;
    }
}
@media screen and (max-width: 767px) {
    .borderbottomTitle {
        padding: 0 0 0.5em 1em;
        font-size: 1.6rem;
    }
}


/* ====================================================
    leftUnderLineTitle
==================================================== */
.leftUnderLineTitle{
    position: relative;
    padding-bottom: 0.5em;
    font-weight: bold;
}
.leftUnderLineTitle .small{
    margin-bottom: 0.25em;
    display: block;
    font-size: 1.8rem;
    font-weight: normal;
}
.leftUnderLineTitle:before{
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 2px;
    background: #FB9E57;
    vertical-align: middle;
}
@media print, screen and (min-width: 768px) {
    .leftUnderLineTitle{
        font-size: 2.8rem;
    }
    .leftUnderLineTitle .small{
        margin-bottom: 0.25em;
        font-size: 1.8rem;
    }
}
@media screen and (max-width: 767px) {

    .leftUnderLineTitle{
        font-size: 2.0rem;
    }
    .leftUnderLineTitle .small{
        margin-bottom: 0.25em;
        font-size: 1.3rem;
    }
}




/* ######################################################################################

　パンくずリスト：widget.css_topicPath

###################################################################################### */
.topicPath {
    display: block;
    clear: both;
    width: 100%;
    margin: 0 auto;
    line-height: 1;
    text-align: left;
}
.topicPath ol li {
    display: inline;
    line-height: 1.5;
}
.topicPath ol li:not(:first-child):before {
    content: "";
    display: inline-block;
    width: 0.5em;
    height: 0.5em;
    border-right: 1px solid rgba(0, 0, 0, 0.3);
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    transform: rotate(-45deg);
    margin: 0 1em 0 0.5em;
    vertical-align: middle;
}

.topicPath ol li a {
    color: #00B2BB;
    text-decoration: none;
}
.topicPath ol li:first-child a {
    color: #00B2BB;
}

.topicPath ol li a:hover { text-decoration: underline; }

@media print, screen and (min-width: 768px) {
    .topicPath li,
    .topicPath a,
    .topicPath span {font-size: 1.4rem;}
}
@media screen and (max-width: 767px) {
    .topicPath li,
    .topicPath a,
    .topicPath span {font-size: 1.2rem;}
}

/* ######################################################################################

　帯背景　wallBelt

###################################################################################### */
.wallBelt {
    overflow: hidden;
}
.wallBelt.yellow{
    background: #FEFDEC;
}
@media print, screen and (min-width: 768px) {
    .wallBelt {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .wallBelt.narrow {
        padding-top: 22px;
        padding-bottom: 22px;
    }
    .wallBelt.wide {
        padding-top: 90px;
        padding-bottom: 90px;
    }
    .wallBelt.extra {
        padding-top: 120px;
        padding-bottom: 120px;
    }
    .wallBelt.topNarrow {
        padding-top: 22px;
    }
    .wallBelt.topWide {
        padding-top: 90px;
    }
    .wallBelt.topExtra {
        padding-top: 120px;
    }
    .wallBelt.bottomNarrow {
        padding-bottom: 22px;
    }
    .wallBelt.bottomWide {
        padding-bottom: 90px;
    }
    .wallBelt.bottomExtra {
        padding-bottom: 120px;
    }
}
@media screen and (max-width: 767px) {
    .wallBelt {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .wallBelt.narrow {
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .wallBelt.wide {
        padding-top: 45px;
        padding-bottom: 45px;
    }
    .wallBelt.extra {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .wallBelt.topNarrow {
        padding-top: 15px;
    }
    .wallBelt.topWide {
        padding-top: 45px;
    }
    .wallBelt.topExtra {
        padding-top: 60px;
    }
    .wallBelt.bottomNarrow {
        padding-bottom: 15px;
    }
    .wallBelt.bottomWide {
        padding-bottom: 45px;
    }
    .wallBelt.bottomExtra {
        padding-bottom: 60px;
    }
}

.wallBelt.gray {
    background: #F2F6F6;
}
.wallBelt.blue {
    background: #93adfb;
}
.wallBelt.zero {
    padding-top: 0;
    padding-bottom: 0;
}
.wallBelt.topZero {
    padding-top: 0;
}
.wallBelt.bottomZero {
    padding-bottom: 0;
}

/* ######################################################################################

　ポップアップ　popUpConatiner

###################################################################################### */
.popUpConatiner .popUpBox {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000000;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease;
}
.popUpConatiner .popUpBox .popupContents {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border: 1px solid #DDDDDD;
    border-radius: 4px;
    z-index: 1000001;
}
.popUpConatiner .popUpBox ul {
    display: flex;
    flex-wrap: wrap;
}
.popUpConatiner .popUpBox li a {
    width: 100%;
    min-width: auto;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
}

.popUpConatiner .popUpBox.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}
.popUpConatiner .popUpButton,
.popUpConatiner .popUpClose {cursor: pointer;}
.popUpConatiner .popUpClose {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    background: #00B2BB;
    border: 1px solid #00989F;
    border-radius: 4px;
    text-indent: -999999px;
}
.popUpConatiner .popUpClose span {
    position: relative;
    display: block;
    height: 100%;
}
.popUpConatiner .popUpClose span:before,
.popUpConatiner .popUpClose span:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 2px;
    height: 16px;
    transform: translate(-50%, -50%);
    background: #fff;
}
.popUpConatiner .popUpClose span:before {transform: translate(-50%, -50%) rotate(45deg);}
.popUpConatiner .popUpClose span:after {transform: translate(-50%, -50%) rotate(-45deg);}

.popUpConatiner .popUpBox .leftLineTitle span::before {
    content: "";
    position: relative;
    top: -2px;
    display: inline-block;
    width: 22px;
    height: 22px;
    margin-right: 4px;
    background-image: url(../img/contents/icon_area_line.svg);
    background-size: cover;
    vertical-align: middle;
}

@media print, screen and (min-width: 768px) {
    .popUpConatiner .popUpBox .popupContents {
        width: 100%;
        max-width: 840px;
        padding: 45px 40px 58px;
    }
    .popUpConatiner .popUpBox .leftLineTitle {
        margin-bottom: 30px;
    }
    .popUpConatiner .popUpClose {
        right: 20px;
        top: 20px;
        width: 38px;
        height: 38px;
    }
    .popUpConatiner .popUpBox ul {
        margin-left: -10px;
        margin-right: -10px;
    }
    .popUpConatiner .popUpBox li {
        width: 33.3333%;
        margin-bottom: 10px;
        padding-left: 10px;
        padding-right: 10px;
    }
}
@media screen and (max-width: 767px) {
    .popUpConatiner .popUpBox .popupContents {
        width: calc(100% - 30px);
        max-width: 100vh;
        padding: 2em 0.75em;
        overflow-y: scroll;
    }
    .popUpConatiner .popUpBox .leftLineTitle {
        margin-bottom: 1em;
    }
    .popUpConatiner .popUpClose {
        right: 10px;
        top: 10px;
        width: 38px;
        height: 38px;
    }
    .popUpConatiner .popUpBox ul {
        margin-left: -5px;
        margin-right: -5px;
    }
    .popUpConatiner .popUpBox li {
        width: 50%;
        margin-bottom: 5px;
        padding-left: 5px;
        padding-right: 5px;
    }
}


/* ######################################################################################

　スライダー　memberRentalSlider

###################################################################################### */
.memberRentalSlider .slick-prev,
.memberRentalSlider .slick-next {z-index: 2;}
.memberRentalSlider .slick-prev {
    left: 0;
    transform: translate(-50%, -50%);
    background-image: url(../img/contents/slideArrowLeft.svg);
}
.memberRentalSlider .slick-next {
    right: 0;
    transform: translate(50%, -50%);
    background-image: url(../img/contents/slideArrowRight.svg);
}
.memberRentalSlider .slick-prev:before,
.memberRentalSlider .slick-next:before {display: none;}

@media print, screen and (min-width: 768px) {
    .memberRentalSlider .slick-prev,
    .memberRentalSlider .slick-next {
        width: 40px;
        height: 40px;
        background-size: 40px 40px;
    }
}
@media screen and (max-width: 767px) {
    .memberRentalSlider .slick-prev,
    .memberRentalSlider .slick-next {
        width: 20px;
        height: 20px;
        background-size: 20px 20px;
    }

    .memberRentalSlider .slick-prev{
        left: 12px;
    }
    .memberRentalSlider .slick-next{
        right: 12px;
    }
}

/* ######################################################################################

　tabColumnList

###################################################################################### */
.tabColumnList > div {display: none;}
.tabColumnList > div.show {display: block;}

/* ######################################################################################

　borderNav

###################################################################################### */
.borderNav {
    display: flex;
    flex-wrap: wrap;
}
.borderNav {margin: 0 -0.1786em;}
.borderNav li {
    margin-bottom: 0.1786em;
    padding-left: 0.1786em;
    padding-right: 0.1786em;
}
.borderNav li a,
.borderNav li span {
    display: block;
    padding: 9px 15px;
    border: 1px solid #00B2BB;
    border-radius: 4px;
    text-align: center;
    text-decoration: none;
    color: #161616;
    cursor: pointer;
}
@media print, screen and (min-width: 768px) {
    .borderNav li.active a,
    .borderNav li.active span,
    .borderNav li a:hover,
    .borderNav li span:hover {
        background-color: #00B2BB;
        color: #fff;
    }
}
@media screen and (max-width: 767px) {
    .borderNav li a,
    .borderNav li span {
        font-size: 1.3rem;
        padding: 9px 10px;
    }
    .borderNav li.active a,
    .borderNav li.active span {
        background-color: #00B2BB;
        color: #fff;
    }
}

/* ######################################################################################

　エリア選択・並び替えエリア serchBox

###################################################################################### */
.serchBox .popUpButton {
    font-weight: normal;
}
.serchBox .popUpButton:after {
    content: "";
    display: inline-block;
    width: 13px;
    height: 18px;
    margin-left: 12px;
    background-image: url(../img/contents/icon_area.png);
    background-size: cover;
}
.orderArea dt {
    font-weight: bold;
    font-size: 1.5rem;
}
@media print, screen and (min-width: 768px) {
    .serchBox {
        display: flex;
        justify-content: space-between;
    }
    .serchBox .popUpButton {
        width: 210px;
        padding: 19px 0.5em 20px;
        border-radius: 4px;
        font-size: 1.6rem;
    }
    .serchBox .popUpButton:hover {opacity: 0.6;}
    .orderArea {
        display: flex;
    }
    .orderArea dl {
        display: flex;
        align-items: center;
    }
    .orderArea dl + dl {margin-left: 40px;}
    .orderArea dt {margin-right: 14px;}
    .orderArea dd .select {font-size: 1.4rem;}
}
@media screen and (max-width: 767px) {
    .serchBox{margin-bottom: 3.5em;}
    .serchBox .popUpButton {
        width: 100%;
        text-align: left;
        border-width: 1px!important;
        padding: 1.35em 1.25em;
    }
    .serchBox .popUpButton:after {
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
    }
    .orderArea {display: flex; justify-content: space-between;}
    .orderArea dl {width: 48%;}
    .orderArea dt {display: none;}
    .orderArea dd .select{width: 100%;}
    .orderArea dd .select select {padding-top: 1.1em; padding-bottom: 1.1em;}
}

/* ######################################################################################

　pagination

###################################################################################### */
.topicsInfo +.pagination {margin-top: 2em;}

.pagination ul {
    display: flex;
    margin-left: -2px;
    margin-right: -2px;
}
.pagination li {padding: 0 2px;}
.pagination li.disabled {display: none;}
.pagination li a,
.pagination li span {
    position: relative;
    display: block;
    width: 34px;
    height: 34px;
    padding-top: 5px;
    background: #fff;
    border: 1px solid #CCCCCC;
    text-align: center;
    font-size: 1.4rem;
    color: #161616;
    text-decoration: none;
}
.pagination li.prev a:before,
.pagination li.next a:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 7px;
    height: 7px;
    border-left: 1px solid #161616;
    border-bottom: 1px solid #161616;
}
.pagination li.prev a:before {transform: translate(-50%, -50%) rotate(45deg);}
.pagination li.next a:before {transform: translate(-50%, -50%) rotate(225deg);}
.pagination li a:hover,
.pagination li.active span {
    background: #161616;
    color: #fff;
}
.pagination li a:hover:before {
    border-left-color: #fff;
    border-bottom-color: #fff;
}

@media print, screen and (min-width: 768px) {
    .pagination li a,
    .pagination li span {border-radius: 50%;}
}
@media screen and (max-width: 767px) {
    .pagination li a,
    .pagination li span {border-radius: 4px;}
}


/* ######################################################################################

　Table

###################################################################################### */
/* =======================================================
    simpleTable
========================================================== */
.simpleTable {
    width: 100%;
    border-collapse: collapse;
    border-right: 1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
}
.simpleTable th,
.simpleTable td {
    border-top: 1px solid #CCCCCC;
    border-left: 1px solid #CCCCCC;
}
.simpleTable th {
    background: #F1F2F2;
    text-align: left;
}
.simpleTable td {background: #fff;}

@media print, screen and (min-width: 768px) {
    .simpleTable th,
    .simpleTable td {
        padding: 12px 15px 16px;
    }
    .simpleTable td {font-size: 1.5rem;}
}
@media screen and (max-width: 767px) {
    .simpleTable th,
    .simpleTable td {
        padding: 0.5em 0.5em 0.75em;
        line-height: 1.5;
    }
}



/* ######################################################################################

　topicsInfo

###################################################################################### */
.topicsInfo.dateInline .entry{
    border-bottom: 1px solid #EBEBEB;
}

.topicsInfo.dateInline .date,
.topicsInfo.dateInline .tag{
    display: inline-block;
}

.topicsInfo.dateInline .date{
    font-size: 1.4rem;
    color: #666666;
}
.topicsInfo.dateInline .tag {
    display:inline-block;
    background: none;
    border-radius:0;
    padding:0;
    margin:0 0 0 0.5em;
}

.topicsInfo.dateInline .tag span{
    position: relative;
    top: -2px;
    margin-left: 0;
    background: #fff;
    border: 1px solid #00B2BB;
    border-radius: 2em;
    color: #00B2BB;
    line-height: 1;
}
.topicsInfo.dateInline .tag span + span{
    margin-left: 0.5em;
}
.topicsInfo.dateInline .title{
    font-size: 1.4rem;
    line-height: 1.75;
}
.topicsInfo.dateInline .title a{
    color: #161616;
    text-decoration: none;
    font-size: 1.5rem;
}
.topicsInfo.dateInline .entry img{
    display: block;
    margin: 10px 0;
}

@media print, screen and (min-width: 768px) {
    .topicsInfo.dateInline .entry{
        padding: 1.75em 0 1.75em;
        margin-bottom: 0;
    }
    .topicsInfo.dateInline .date{
        padding-top: 0;
        padding-bottom: 0.75em;
    }
    .topicsInfo.dateInline .tag span{
        padding: 0.15em 1em;
        font-size: 1.1rem;
    }
    .topicsInfo.dateInline .title{
        padding-bottom: 0;
        letter-spacing: 0.1em;
    }
    .topicsInfo.dateInline .entry img{max-width: 1080px;}
}
@media screen and (max-width: 767px) {
    .topicsInfo.dateInline .entry{
        padding: 1.25em 0 1.25em;
        margin-bottom: 0;
    }
    .topicsInfo.dateInline .date{
        padding-top: 0;
        padding-bottom: 0em;
    }
    .topicsInfo.dateInline .tag span {
        padding: 0.35em 0.75em;
        font-size: 1.1rem;
        min-width: 5em;
    }
    .topicsInfo.dateInline .title{margin-top: 0.5em; padding-bottom: 0}
    .topicsInfo.dateInline .entry img{max-width: 100%;}
}


/* ====================================================
　詳細
==================================================== */
.topicsInfo.dateInline.detail{
    border-bottom: 1px solid #ddd;
}
.topicsInfo.dateInline.detail .title{
    font-weight: bold;
    font-size: 1.6rem;
    letter-spacing: 0;
    line-height: 1.5;
}
.topicsInfo.dateInline .text{
    padding: 0;
    font-size: 1.4rem;
    letter-spacing: 0.05em;
    line-height: 1.75;
}

.topicsInfo.dateInline .text a{
    color: #E57777;
    text-decoration: underline;
}
.topicsInfo.dateInline .text a:hover{
    text-decoration: none;
}

@media print, screen and (min-width: 768px) {
    .topicsInfo.dateInline.detail{
        margin-bottom: 2em;
        padding-bottom: 1em;
    }
    .topicsInfo.dateInline.detail .entry:first-of-type{padding-top: 0;}
    .topicsInfo.dateInline.detail .date{padding-bottom: 0.75em;}
    .topicsInfo.dateInline.detail .title{padding-bottom: 0.5em;}

}
@media screen and (max-width: 767px) {
    .topicsInfo.dateInline.detail{
        margin-bottom: 1.5em;
        padding-bottom: 0.5em;
    }
    .topicsInfo.dateInline.detail .title{padding-bottom: 0.75em;}
}



/* ######################################################################################

　WYSIWYG　wysiwyg

###################################################################################### */
.wysiwyg h1 {
    position: relative;
    margin-bottom: 1em;
    padding-top: 0.8572em;
    padding-bottom: 0.8572em;
    border-top: 1px solid #333333;
    border-bottom: 1px solid #333333;
    color: #333;
    font-weight: normal;
}
.wysiwyg h1:before{
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 70px;
    height: 4px;
    margin-right: 0.5em;
    background: #00B2BB;
    vertical-align: middle;
}

.wysiwyg * + h3 {
    margin-top: 3em;
}
.wysiwyg h3 {
    position: relative;
    margin-bottom: 1em;
    padding-bottom: 0.6em;
    border-bottom: 2px solid #ddd;
    color: #333;
}
.wysiwyg h3:before{
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 70px;
    height: 2px;
    margin-right: 0.5em;
    background: #00B2BB;
    vertical-align: middle;
}

.wysiwyg a{
    color: #00B2BB;
}
.wysiwyg a:hover{
    text-decoration: none;
}

@media print, screen and (min-width: 768px) {
    .wysiwyg {
        font-size: 1.8rem;
        line-height: 1.8889;
    }
    .wysiwyg h1 {
        font-size: 1.5556em;
    }
    .wysiwyg h3 {
        font-size: 1.8rem;
    }
    .wysiwyg img.alignleft + h1,
    .wysiwyg img.alignright + h1 {overflow: hidden;}
}
@media screen and (max-width: 767px) {
    .wysiwyg {
        font-size: 1.6rem;
        line-height: 1.75;
    }
    .wysiwyg h1 {
        font-size: 1.5556em;
    }
    .wysiwyg h3 {
        font-size: 1.5rem;
    }
    .wysiwyg strong{
        font-size: 1.7rem;
    }

    .wysiwyg br + br + br + br{display: none;}
    .wysiwyg img.alignleft,
    .wysiwyg img.alignright{display: block; margin: 1em auto;}
}

.wysiwyg table{
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}
.wysiwyg table th,
.wysiwyg table td{
    padding: 0.75em;
    border-bottom: solid 1px #CDD6DD;
}
.wysiwyg table tr:first-of-type th,
.wysiwyg table tr:first-of-type td{
    border-top: 1px solid #CDD6DD;
}
.wysiwyg table tr th:first-of-type,
.wysiwyg table tr td:first-of-type{
    border-left: solid 1px #CDD6DD;
}
.wysiwyg table tr th:last-child,
.wysiwyg table tr td:last-child{
    border-right: solid 1px #CDD6DD;
}

.wysiwyg table th{
    background-color: #F2F6F6;
    text-align: center;
    color: #333333;
    font-weight: normal;
}
@media print, screen and (min-width: 768px) {
    .wysiwyg table th{
        min-width: 140px;
    }
}
@media screen and (max-width: 767px) {
    .wysiwyg table{
        width: 100%!important;
    }
    .wysiwyg table th{
        min-width: 100px;
    }
}
@media print, screen and (min-width: 768px) {
    .wysiwyg .imageBox{
        margin-top: 3em;
    }
    .wysiwyg .imageBox {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        margin-left: -15px;
        margin-right: -15px;
    }
    .wysiwyg .imageBox li {
        width: 50%;
        margin-bottom: 30px;
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media screen and (max-width: 767px) {
    .wysiwyg .imageBox{
        margin-top: 2em;
    }
}


/* ######################################################################################

　WYSIWYG　wysiwyg support

###################################################################################### */
.wysiwyg.support h1 {
    position: relative;
    margin-bottom: 1em;
    padding-top: 0;
    padding-bottom: 0.8572em;
    border-top: none;
    border-bottom: 1px solid #EAEAEA;
    color: #333;
    font-weight: bold;
}
.wysiwyg.support h1:before{
    content: "";
    display: inline-block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 15px;
    height: 1px;
    margin-right: 0.5em;
    background: #00B2BB;
    vertical-align: middle;
}

@media print, screen and (min-width: 768px) {
    .wysiwyg {
        font-size: 1.5rem;
        line-height: 2;
    }
    .wysiwyg h1 {
        font-size: 1.3333em;
        line-height: 1.8;
    }
    .wysiwyg img.alignleft + h1 {overflow: hidden;}
}
@media screen and (max-width: 767px) {
    .wysiwyg {
        font-size: 1.5rem;
        line-height: 1.75;
    }
    .wysiwyg h1 {
        font-size: 1.3333em;
    }
}

/* ######################################################################################

　businessBox

###################################################################################### */
.businessBox dt {
    text-align: center;
    color: #fff;
    font-weight: bold;
}
.businessBox .business:nth-of-type(1) dt {background: #A4D16A;}
.businessBox .business:nth-of-type(2) dt {background: #FB9E57;}
.businessBox .business:nth-of-type(3) dt {background: #F28AB9;}
.businessBox .business dl {
    box-shadow: 0 5px 16px rgba(0, 0, 0, 0.08);
}
.businessBox dt span {display: block;}
.businessBox dd {
    background: #fff;
    border-left: 1px solid #DDDDDD;
    border-right: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
    line-height: 1.8571;
}
.businessBox dd .image {text-align: center;}
.businessBox .more {
    text-align: center;
}
.businessBox .more .button {
    width: 100%;
    padding-top: 25px;
    padding-bottom: 25px;
}

@media print, screen and (min-width: 768px) {
    .businessBox .businessList {display: flex;}
    .businessBox .businessList {
        margin: 0 -25px;
    }
    .businessBox .businessList .business {
        width: 33.3333%;
        padding-left: 2%x;
        padding-right: 2%;
    }
    .businessBox dt {
        padding-top: 20px;
        padding-bottom: 22px;
        font-size: 1.5rem;
        line-height: 1.4;
    }
    .businessBox dt span {
        margin-top: 7px;
        font-size: 2.2rem;
    }
    .businessBox dd .image {
        padding-top: 25px;
    }
    .businessBox dd .detail {
        padding: 25px 20px 60px;
    }
    .businessBox .more {
        margin-top: -35px;
    }
    .businessBox .more .button {
        max-width: 300px;
    }
}
@media screen and (max-width: 767px) {
    .businessBox .businessList .business + .business {margin-top: 2em;}
    .businessBox dt {
        padding-top: 1em;
        padding-bottom: 1em;
        font-size: 1.3rem;
        line-height: 1.2;
    }
    .businessBox dt span {
        margin-top: 7px;
        font-size: 2.0rem;
    }
    .businessBox dd .image {
        padding-top: 1.5em;
        padding-left: 2.5em;
        padding-right: 2.5em;
    }
    .businessBox dd .image img{
        margin-bottom: 0;
    }
    .businessBox dd .detail {
        padding: 1.5em 1em 60px;
    }
    .businessBox .more {
        margin-top: -35px;
        padding: 0 2em;
    }
    .businessBox .more .button {font-size: 1.5rem; border-width: 2px;}
}

/* ######################################################################################

　リスト

###################################################################################### */
.numList > li{position: relative; padding-left: 1.75em;}
.numList > li:before{position: absolute; top: 0; left: 0;}

.numList > li:nth-child(1):before{content:"1.";}
.numList > li:nth-child(2):before{content:"2.";}
.numList > li:nth-child(3):before{content:"3.";}
.numList > li:nth-child(4):before{content:"4.";}
.numList > li:nth-child(5):before{content:"5.";}
.numList > li:nth-child(6):before{content:"6.";}
.numList > li:nth-child(7):before{content:"7.";}
.numList > li:nth-child(8):before{content:"8.";}
.numList > li:nth-child(9):before{content:"9.";}
.numList > li:nth-child(10):before{content:"10.";}
.numList > li:nth-child(11):before{content:"11.";}
.numList > li:nth-child(12):before{content:"12.";}
.numList > li:nth-child(13):before{content:"13.";}
.numList > li:nth-child(14):before{content:"14.";}
.numList > li:nth-child(15):before{content:"15.";}
.numList > li:nth-child(16):before{content:"16.";}
.numList > li:nth-child(17):before{content:"17.";}
.numList > li:nth-child(18):before{content:"18.";}
.numList > li:nth-child(19):before{content:"19.";}
.numList > li:nth-child(20):before{content:"20.";}
.numList > li:nth-child(21):before{content:"21.";}



/* ######################################################################################

　subBox

###################################################################################### */
.subBox{
    display: flex;
    flex-direction:column;
    flex-wrap: wrap;
    border-top:1px solid #dddddd;
}
.subBox li{
    border-bottom:1px solid #dddddd;
}
.subBox li a{
    display: flex;
    justify-content:flex-start;
    align-items:center;
    height:3.4em;
    text-decoration: none;
    padding:0 0.75em;
    color: #666666;
    font-size: 1.5rem;
    font-weight: bold;
}
.subBox li a:hover{color: #00B2BB;background: #F2F6F6;}
.subBox li.active a {
    background: #00B2BB;
    color: #ffffff;
}



/* ######################################################################################

　menuList

###################################################################################### */
.menuList__item a{
    display: block;
    background: #fff;
    text-align: center;
    text-decoration: none;
    border-radius: 6px;
    color: #161616;
    border: 2px solid #00B2BB;
    font-weight: bold;
}
.menuList__item a:hover{background: #00B2BB;color: #fff;}
.menuList__item.no-posts a{
    border-color: #DDDDDD;
    color: #666666;
    pointer-events: none;
}

@media print, screen and (min-width: 768px) {
    .menuList{display: flex; justify-content: space-between; flex-wrap: wrap;}
    .menuList:after{
        content: "";
        display: block;
        width: 31.1%;
    }
    .menuList__item{width: 31.1%; margin-bottom: 1.75em;}
    .menuList__item a{
        padding: 1.25em 0.75em;
        font-size: 1.6rem;
    }
}
@media screen and (max-width: 767px){
    .menuList{display: flex; justify-content: space-between; flex-wrap: wrap;}
    .menuList__item{width: 48%; margin-bottom: 0.75em;}
    .menuList__item span,
    .menuList__item a{
        padding: 1em 0.75em;
        font-size: 1.4rem;
    }
}