@charset "UTF-8";
/*----------------------------------------------------
グローバルナビブレイクポイント
/* ハンバーガーメニューの切り替わるポイント。
----------------------------------------------------*/
/* gnav.jsの変数「gNav_bpoint」も数値を合わせる */
/*----------------------------------------------------
基本設定
----------------------------------------------------*/
/* ホバー変更はやさ*/
/* slickのautoスライドの時などに、画面をタップするとスライドが動かなくなるのを防ぐ */
/* safariでボタンを押した際に出てくる青枠を消す */
/*----------------------------------------------------
中央寄せ
----------------------------------------------------*/
/* 上下左右中央寄せ */
/* 上下中央寄せ */
/* 左右中央寄せ */
/*----------------------------------------------------
リストマーカー
----------------------------------------------------*/
/*----------------------------------------------------
よく使う疑似要素、小技
----------------------------------------------------*/
/* ボックス影 */
/* 反転*/
/* 文字幅が指定幅を超えたときに「...」を表示する */
/* icon 横にぐるっと回転 */
/* 親要素よりも幅を超えて表示 */
/* 矢印 */
/*----------------------------------------------------
矢印つきボタン
----------------------------------------------------*/
/*----------------------------------------------------
読み込み
----------------------------------------------------*/
/*----------------------------------------------------
フォント
----------------------------------------------------*/
/* Light/Medium */
/* Regular/Medium */
/*----------------------------------------------------
google font
----------------------------------------------------*/
/*----------------------------------------------------
フォント設定
----------------------------------------------------*/
/*----------------------------------------------------
//html例：テキストこちらテキス
----------------------------------------------------*/
/* ホバーで下線が左に消える */
/* ホバーで左から右に線が出る */
/* ホバーで中央から線が出る */
/* ホバーで中央の線がきえる */
/*----------------------------------------------------
中央から下線
//html例：こちらテキス
----------------------------------------------------*/
/* ホバーで下線が左に消える */
/* ホバーで左から右に線が出る */
/* ホバーで中央から線が出る */
/* ホバーで中央の線がきえる */
/*----------------------------------------------------
中央から下線
//html例：
; ?>/assets/images/top/introduction/catch.png)
----------------------------------------------------*/
/* 左から右に流れる */
/* 右から左に流れる */
/*----------------------------------------------------
ふわふわ 動き続ける
----------------------------------------------------*/
/* 上下にふわふわ */
/* ホバーすると上にテキストが透明になって、下から出てくる */
@-webkit-keyframes textMove {
0% {
opacity: 1;
}
25% {
-webkit-transform: translateY(-1em);
transform: translateY(-1em);
opacity: 0;
}
50% {
-webkit-transform: translateY(1em);
transform: translateY(1em);
opacity: 0;
}
75% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
@keyframes textMove {
0% {
opacity: 1;
}
25% {
-webkit-transform: translateY(-1em);
transform: translateY(-1em);
opacity: 0;
}
50% {
-webkit-transform: translateY(1em);
transform: translateY(1em);
opacity: 0;
}
75% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
/* くるくる回り続ける */
@-webkit-keyframes fadeUpAnimeCircle {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes fadeUpAnimeCircle {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
body {
background: url(../images/common/bg_mesh.jpg);
background-repeat: repeat;
background-size: 50px;
}
.mgT {
margin-top: 40px;
}
.mgB {
margin-bottom: 22px;
}
.bold {
font-weight: bold;
}
.medi {
font-weight: 500;
}
.large {
font-size: 20px;
/* 751- */
}
@media all and (min-width: 751px) {
.large {
font-size: 22px;
}
}
.page_title::after {
background-color: #C9E8EA;
}
/*----------------------------------------------------
タブ
----------------------------------------------------*/
.tab {
margin: 40px 0 0 0;
/* 751- */
}
@media all and (min-width: 751px) {
.tab {
margin: 70px 0 0 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
}
.tab li {
border-bottom: 2px solid #398C93;
}
.tab li a {
text-align: center;
display: inline-block;
width: 100%;
padding: 16px 0;
font-weight: 500;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.tab li a.active {
background-color: #398C93;
color: #fff;
}
.tab {
/* 751- */
}
@media all and (min-width: 751px) {
.tab li a:not(.active):hover {
background-color: #E4F2F5;
}
.tab.col3 li {
width: 33.3333333333%;
}
.tab.col4 li {
width: 25%;
}
}
.tab_content {
display: none;
opacity: 0;
}
.tab_content.is-active {
display: block;
opacity: 1;
-webkit-animation-name: fadeUpAnime;
animation-name: fadeUpAnime;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
opacity: 0;
}
.stepTitle {
font-weight: bold;
position: relative;
margin-bottom: 41px;
font-size: 20px;
letter-spacing: 0.08em;
line-height: 1.6667;
/* 751- */
}
@media all and (min-width: 751px) {
.stepTitle {
font-size: 30px;
letter-spacing: 0.08em;
line-height: 1.6667;
padding-left: 145px;
margin-bottom: 60px;
}
}
.stepTitle .step span {
display: inline-block;
padding: 2px 42px 2px 15px;
margin-bottom: 3px;
background: linear-gradient(120deg, #398C93 70%, rgba(213, 219, 59, 0) 70%, rgba(213, 219, 59, 0) 100%);
color: white;
font-family: Roboto, sans-serif;
font-weight: 400;
font-weight: bold;
font-size: 12px;
letter-spacing: 0.05em;
line-height: 1.6667;
/* 751- */
}
@media all and (min-width: 751px) {
.stepTitle .step span {
position: absolute;
margin-bottom: 0;
top: 7px;
left: 0;
font-size: 18px;
letter-spacing: 0.05em;
line-height: 1.6667;
padding: 5px 70px 5px 21px;
}
}
.buy .stepTitle .step span {
background: linear-gradient(120deg, #D6A601 70%, rgba(213, 219, 59, 0) 70%, rgba(213, 219, 59, 0) 100%);
}
.linkText {
position: relative;
color: #2662B4;
opacity: 1;
-webkit-transition: all 0.5s;
transition: all 0.5s;
}
.linkText::after {
content: "";
position: absolute;
height: 1px;
width: 100%;
background-color: #2662B4;
left: 0;
bottom: -2px;
-webkit-transition: all 0.5s;
transition: all 0.5s;
}
.linkText {
/* 751- */
}
@media all and (min-width: 751px) {
.linkText:hover {
opacity: 0.8;
}
.linkText:hover::after {
left: 0%;
-webkit-transform: scale(1, 0);
transform: scale(1, 0); /* x軸方向に縮小で0にして消えてるように見せる */
width: 0%;
}
}
section {
margin-top: 60px;
/* 751- */
}
@media all and (min-width: 751px) {
section {
margin-top: 100px;
}
}
.attenDocu {
font-size: 11px;
letter-spacing: 0em;
line-height: 2;
color: #646464;
margin-top: -20px;
/* 751- */
}
@media all and (min-width: 751px) {
.attenDocu {
font-size: 12px;
letter-spacing: 0em;
line-height: 2;
margin-top: -30px;
}
}
.attentionArea {
background-color: #E5F5F7;
padding: 33px 20px;
/* -750 */
}
@media all and (max-width: 751px) {
.attentionArea {
margin: 0 calc(50% - 50vw) 40px;
width: 100vw;
}
.attentionArea.wide {
padding: 33px 0;
}
}
.attentionArea {
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea {
padding: 50px 60px;
}
.attentionArea.wide {
padding: 50px 0;
margin: 0 calc(50% - 50vw);
width: 100vw;
}
}
.attentionArea .attnBox {
margin-bottom: 30px;
}
.attentionArea .attnBox.mg70 {
margin-bottom: 40px;
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea .attnBox.mg70 {
margin-bottom: 60px;
}
}
.attentionArea .attnBox:last-child {
margin-bottom: 0;
}
.attentionArea .attenTitle {
font-weight: bold;
color: #398C93;
margin-bottom: 20px;
font-size: 14px;
letter-spacing: 0em;
line-height: 1.6667;
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea .attenTitle {
font-size: 18px;
letter-spacing: 0em;
line-height: 1.6667;
}
}
.attentionArea .attenSubTitle {
margin: 20px 0 10px;
font-weight: bold;
font-size: 13px;
letter-spacing: 0em;
line-height: 1.6667;
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea .attenSubTitle {
font-size: 16px;
letter-spacing: 0em;
line-height: 1.6667;
}
}
.attentionArea .boxTitle {
margin-bottom: 5px;
}
.attentionArea .miniWrap {
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea .miniWrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-column-gap: 10px;
-moz-column-gap: 10px;
column-gap: 10px;
}
.attentionArea .miniWrap .boxmini {
width: 50%;
}
}
.attentionArea .boxmini {
background-color: #fff;
/* -750 */
}
@media all and (max-width: 751px) {
.attentionArea .boxmini {
margin-bottom: 20px;
}
.attentionArea .boxmini:last-child {
margin-bottom: 0px;
}
}
.attentionArea .boxmini .miniText {
padding: 20px 16px;
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea .boxmini .miniText {
padding: 28px 35px;
}
}
.attentionArea .boxmini .minilt {
list-style: none;
margin-left: 1.5em;
}
.attentionArea .boxmini .minilt > li {
position: relative;
}
.attentionArea .boxmini .minilt > li::before {
content: "●";
position: absolute;
left: -1.5em;
}
.attentionArea .boxmini .minilt li {
line-height: 1.8;
/* -750 */
}
@media all and (max-width: 751px) {
.attentionArea .boxmini .minilt li {
margin-bottom: 10px;
}
.attentionArea .boxmini .minilt li:last-child {
margin-bottom: 0;
}
}
.attentionArea .boxmini .minilt li::before {
color: #D6A601;
top: 0px;
}
.attentionArea .boxmini .minilt {
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea .boxmini .minilt {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
row-gap: 14px;
}
.attentionArea .boxmini .minilt li {
width: 100%;
}
}
.attentionArea .boxmini .miniTitle {
background-color: #D6A601;
text-align: center;
color: white;
padding: 7px 0;
font-weight: bold;
font-size: 14px;
letter-spacing: 0.15em;
line-height: 1.6667;
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea .boxmini .miniTitle {
padding: 13px 0;
font-size: 18px;
letter-spacing: 0.15em;
line-height: 1.6667;
}
}
.attentionArea .boxmini .gray {
margin-top: 20px;
font-size: 11px;
color: #8F949F;
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea .boxmini .gray {
font-size: 15px;
}
}
.attentionArea .boxmini.agent .miniTitle {
background-color: #4E3D2A;
}
.attentionArea .boxmini.agent .minilt li::before {
color: #4E3D2A;
}
.attentionArea .lt {
list-style: none;
margin-left: 1.5em;
}
.attentionArea .lt > li {
position: relative;
}
.attentionArea .lt > li::before {
content: "●";
position: absolute;
left: -1.5em;
}
.attentionArea .lt li {
/* -750 */
}
@media all and (max-width: 751px) {
.attentionArea .lt li {
margin-bottom: 10px;
}
.attentionArea .lt li:last-child {
margin-bottom: 0;
}
}
.attentionArea .lt li::before {
color: #D6A601;
top: 0px;
}
.attentionArea .lt {
/* 751- */
}
@media all and (min-width: 751px) {
.attentionArea .lt {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
row-gap: 14px;
-webkit-column-gap: 10px;
-moz-column-gap: 10px;
column-gap: 10px;
}
.attentionArea .lt li {
width: 46%;
}
}
.box {
margin-bottom: 41px;
/* 751- */
}
@media all and (min-width: 751px) {
.box {
margin-bottom: 40px;
}
}
.box .text {
font-size: 14px;
letter-spacing: 0em;
line-height: 2;
/* 751- */
}
@media all and (min-width: 751px) {
.box .text {
font-size: 16px;
letter-spacing: 0em;
line-height: 1.75;
}
}
.box .text.blue {
color: #398C93;
font-weight: bold;
}
.box .text.small {
font-size: 12px;
/* 751- */
}
@media all and (min-width: 751px) {
.box .text.small {
font-size: 14px;
}
}
.box .boxTitle {
color: #1F2A40;
font-weight: bold;
margin-bottom: 20px;
font-size: 14px;
letter-spacing: 0em;
line-height: 1.6667;
/* 751- */
}
@media all and (min-width: 751px) {
.box .boxTitle {
margin-bottom: 19px;
font-size: 18px;
letter-spacing: 0em;
line-height: 1.6667;
}
}
.box .boxTitle.blue {
color: #398C93;
font-weight: bold;
}
/*----------------------------------------------------
main
----------------------------------------------------*/
main {
margin: 78px 0 50px;
/* 751- */
}
@media all and (min-width: 751px) {
main {
margin: 90px 0 100px;
}
}
/*----------------------------------------------------
イントロ
----------------------------------------------------*/
#intro .stepArea {
/* -750 */
}
@media all and (max-width: 751px) {
#intro .stepArea {
margin: 0 auto 60px;
}
}
#intro .stepArea {
/* 751- */
}
@media all and (min-width: 751px) {
#intro .stepArea {
margin: 10px auto 60px;
}
}
#intro .lt {
/* 751- */
}
@media all and (min-width: 751px) {
#intro .lt {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
row-gap: 50px;
-webkit-column-gap: 25px;
-moz-column-gap: 25px;
column-gap: 25px;
}
#intro .lt::after {
content: "";
display: block;
width: 200px;
}
}
#intro .lt .stepNum {
position: absolute;
top: -10px;
z-index: 2;
font-size: 12px;
letter-spacing: 0.05em;
line-height: 1.6667;
font-family: Roboto, sans-serif;
font-weight: 400;
-webkit-transition: all 0.5s;
transition: all 0.5s;
font-weight: bold;
background-color: #0D2341;
color: white;
text-align: center;
padding: 3px 14px;
/* -750 */
}
@media all and (max-width: 751px) {
#intro .lt .stepNum {
width: 80px;
}
}
#intro .lt .stepNum {
/* 751- */
}
@media all and (min-width: 751px) {
#intro .lt .stepNum {
padding: 3px 14px;
font-size: 14px;
letter-spacing: 0.1em;
line-height: 1.6667;
}
}
#intro .lt .item {
/* -750 */
}
@media all and (max-width: 751px) {
#intro .lt .item {
max-width: 310px;
margin: 0 auto 33px;
}
#intro .lt .item:last-child {
margin-bottom: 0;
}
}
#intro .lt .item a {
position: relative;
display: block;
}
#intro .lt .item a::before {
content: "";
position: absolute;
display: block;
background: #0D2341;
width: 25px;
height: 25px;
border-radius: 50%;
bottom: -10px;
-webkit-transition: all 0.5s;
transition: all 0.5s;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
z-index: 2;
}
#intro .lt .item a::after {
content: "";
position: absolute;
width: 7px;
height: 7px;
border-top: solid 2px white;
border-right: solid 2px white;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
bottom: 0;
left: calc(50% - 3px);
z-index: 3;
}
#intro .lt .item a {
/* 751- */
}
@media all and (min-width: 751px) {
#intro .lt .item a:hover .stepWrap {
background-color: #F5FEFF;
border-color: #398C93;
}
#intro .lt .item a:hover .stepNum {
background-color: #398C93;
}
#intro .lt .item a:hover::before {
background-color: #398C93;
}
}
#intro .lt .item .stepWrap {
-webkit-transition: all 0.5s;
transition: all 0.5s;
/* -750 */
}
@media all and (max-width: 751px) {
#intro .lt .item .stepWrap {
height: 124px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
border: 2px solid #0D2341;
background: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(50%, #fff), color-stop(50%, #C9E8EA), to(#C9E8EA));
background: linear-gradient(90deg, #fff 0%, #fff 50%, #C9E8EA 50%, #C9E8EA 100%);
}
#intro .lt .item .stepWrap > div {
width: 50%;
}
#intro .lt .item .stepWrap .textArea {
background-color: #C9E8EA;
padding: 33px 24px;
position: relative;
text-align: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
#intro .lt .item .stepWrap .imgArea {
position: relative;
text-align: center;
}
#intro .lt .item .stepWrap .imgArea span {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#intro .lt .item .stepWrap .imgArea img {
width: 100%;
}
}
#intro .lt .item .stepWrap {
/* 751- */
}
@media all and (min-width: 751px) {
#intro .lt .item .stepWrap {
display: block;
background-color: white;
width: 200px;
height: 250px;
border: 2px solid #0D2341;
}
#intro .lt .item .stepWrap .imgArea {
text-align: center;
}
#intro .lt .item .stepWrap .textArea {
padding-top: 25px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
}
@media all and (min-width: 1200px) {
#intro .lt .item .stepWrap::before {
content: "";
position: absolute;
height: 2px;
width: 100%;
background-color: #0D2341;
z-index: -1;
left: 0;
}
}
#intro .foot {
padding: 50px 0;
background-color: #E4F2F5;
}
#intro .text {
font-size: 14px;
letter-spacing: 0.03em;
line-height: 2.428;
font-weight: bold;
/* 751- */
}
@media all and (min-width: 751px) {
#intro .text {
font-size: 16px;
letter-spacing: 0.03em;
line-height: 2.428;
}
}
#intro .btnArea {
text-align: center;
margin-top: 20px;
}
#intro .btnArea .banner {
display: block;
margin: 0 auto;
max-width: 320px;
}
#intro .btnArea {
/* 751- */
}
@media all and (min-width: 751px) {
#intro .btnArea {
margin-top: 30px;
}
#intro .btnArea .banner {
max-width: 408px;
}
#intro .btnArea .banner img {
-webkit-transition: all 0.5s;
transition: all 0.5s;
}
#intro .btnArea .banner:hover img {
scale: 1.05;
}
}
.btnArea.foot {
text-align: center;
/* -750 */
}
@media all and (max-width: 751px) {
.btnArea.foot {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
row-gap: 14px;
margin-top: 50px;
}
}
.btnArea.foot {
/* 751- */
}
@media all and (min-width: 751px) {
.btnArea.foot {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;
margin-top: 100px;
}
}
.btn.color {
background-color: #398C93;
border: 1px solid #398C93;
}
.btn.color::after {
border-color: transparent transparent transparent #398C93;
}
.btn.color {
/* 751- */
}
@media all and (min-width: 751px) {
.btn.color:hover {
color: #398C93;
background-color: #fff;
}
.btn.color:hover::before {
background: #398C93;
}
.btn.color:hover::after {
border-color: transparent transparent transparent white;
}
}
.colortext {
color: #398C93;
}
/*----------------------------------------------------
２番目以降のタブ
----------------------------------------------------*/
.subtab .icontitle {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 20px;
margin-bottom: 40px;
font-weight: bold;
/* 751- */
}
@media all and (min-width: 751px) {
.subtab .icontitle {
font-size: 30px;
margin-bottom: 50px;
}
}
.subtab .icontitle span {
display: inline-block;
width: 50px;
margin-right: 16px;
-ms-flex-negative: 0;
flex-shrink: 0;
/* 751- */
}
@media all and (min-width: 751px) {
.subtab .icontitle span {
width: 80px;
margin-right: 20px;
}
}
.subtab .mTitle {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 18px;
margin-bottom: 30px;
font-weight: bold;
margin-top: 70px;
/* 751- */
}
@media all and (min-width: 751px) {
.subtab .mTitle {
font-size: 24px;
margin-bottom: 40px;
margin-top: 100px;
}
}
.subtab .mTitle span {
display: inline-block;
width: 20px;
margin-right: 10px;
-ms-flex-negative: 0;
flex-shrink: 0;
/* 751- */
}
@media all and (min-width: 751px) {
.subtab .mTitle span {
width: 28px;
}
}
.subtab .btnArea.wide {
text-align: center;
margin-top: 20px;
}
.subtab .btnArea.wide .btn {
margin: 0 auto;
display: block;
width: initial;
max-width: 310px;
}
.subtab .btnArea.wide {
/* 751- */
}
@media all and (min-width: 751px) {
.subtab .btnArea.wide {
margin-top: 30px;
}
.subtab .btnArea.wide .btn {
padding: 21px 0;
max-width: 523px;
}
}
.subtab .boxSubTitle {
padding-bottom: 5px;
font-weight: bold;
font-size: 14px;
/* 751- */
}
@media all and (min-width: 751px) {
.subtab .boxSubTitle {
font-size: 16px;
}
}
.subtab .flexbox {
/* 751- */
}
@media all and (min-width: 751px) {
.subtab .flexbox {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.subtab .flexbox .box {
width: 48%;
}
}
.subtab .flexlist {
margin-bottom: 40px;
}
.subtab .flexlist > ul {
border-top: 1px solid #E4E4E4;
padding: 20px 0;
}
.subtab .flexlist > ul:last-child {
border-bottom: 1px solid #E4E4E4;
}
.subtab .flexlist > ul > li {
margin-bottom: 5px;
}
.subtab .flexlist > ul > li:last-child {
margin-bottom: 0;
}
.subtab .flexlist > ul > li h4 {
width: 90px;
-ms-flex-negative: 0;
flex-shrink: 0;
font-weight: bold;
font-size: 14px;
line-height: 2;
}
.subtab .flexlist {
/* 751- */
}
@media all and (min-width: 751px) {
.subtab .flexlist {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.subtab .flexlist > ul {
padding: 0 33px;
border-left: 1px solid #E4E4E4;
border-top: none;
}
.subtab .flexlist > ul:last-child {
border-right: 1px solid #E4E4E4;
border-bottom: none;
}
.subtab .flexlist > ul > li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-bottom: 10px;
}
.subtab .flexlist > ul > li h4 {
font-size: 16px;
line-height: 1.75;
}
.subtab .flexlist.col1 > ul {
width: 100%;
}
.subtab .flexlist.col2 > ul {
width: 50%;
}
.subtab .flexlist.col3 > ul {
width: 33.3333333333%;
}
}
.subtab .flexlist {
/* -750 */
}
@media all and (max-width: 751px) {
.subtab .flexlist.spJointNext {
margin-bottom: 0;
}
.subtab .flexlist.spJointNext > ul:last-child {
border-bottom: none;
}
}
.subtab .texttable th {
padding-bottom: 10px;
}
.subtab .texttable .tableTitle {
font-size: 14px;
line-height: 2;
padding-right: 10px;
min-width: 70px;
/* 751- */
}
@media all and (min-width: 751px) {
.subtab .texttable .tableTitle {
font-size: 16px;
line-height: 1.75;
padding-right: 30px;
min-width: 94px;
}
}
.subtab .texttable .text {
font-weight: normal;
}
.figure h3 {
color: #fff;
padding: 8px 10px;
}
.figure table {
width: 100%;
}
.figure table th, .figure table td {
border: 1px solid #34373B;
padding: 8px 10px;
font-size: 13px;
vertical-align: middle;
/* 751- */
}
@media all and (min-width: 751px) {
.figure table th, .figure table td {
font-size: 16px;
}
}
.figure table th {
font-weight: 500;
}
.figure table th.vertical {
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
text-align: center;
letter-spacing: 0.8em;
}
.figure table td {
background-color: #fff;
}
.figure .notes {
margin-top: 10px;
font-size: 11px;
letter-spacing: 0em;
line-height: 2;
color: #646464;
/* 751- */
}
@media all and (min-width: 751px) {
.figure .notes {
font-size: 12px;
letter-spacing: 0em;
line-height: 2;
}
}
/*# sourceMappingURL=rentbuy.css.map */