@charset "utf-8";

/*=========================================
  スマホ 320〜559pxと全デバイス共通のスタイル
==========================================*/
/*-----------------------------
  　　　　　　全体
------------------------------*/
/* clearfix hack */
.cf:after {
	content: "";
	clear: both;
	display: block;
}

body {
	width: 100%;
	background-color: transparent;
	color: #333;
	font-family: 'Noto Sans JP', "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

p {
	text-align: left;
	font-size: 16px;
	line-height: 1.5;
}

a {text-decoration: none;}
a:hover {opacity: 0.5;}
a.anchor {display: block; padding-top: 70px; margin-top: -70px; opacity: 1;}

.atlas-sp-main {padding-bottom: 0;}
.atlas-header {position: relative; z-index: 1;}

/* width */
.w100per {width: 100%;}
.w90per {width: 90%;}
.w70per {width: 70%;}
.w50per {width: 50%;}
.w30per {width: 30%;}
.w60 {width: 60px;}
.w160 {width: 160px;}
.w170 {width: 170px;}
.w180 {width: 180px;}
.w195 {width: 195px;}
.mw150 {width: 100%; max-width: 150px;}
.mw316 {width: 100%; max-width: 316px;}
.mw350 {width: 100%; max-width: 350px;}
.mw450 {width: 100%; max-width: 450px;}
.mw500 {width: 100%; max-width: 500px;}
.mw625 {width: 100%; max-width: 625px;}
.mw650 {width: 100%; max-width: 650px;}
.mw700 {width: 100%; max-width: 700px;}
.mw715 {width: 100%; max-width: 715px;}
.mw800 {width: 100%; max-width: 800px;}
.mw850 {width: 100%; max-width: 850px;}
.mw900 {width: 100%; max-width: 900px;}
.mw955 {width: 100%; max-width: 955px;}
.mw1000 {width: 100%; max-width: 1000px;}
.w100to140 {width: 100px;}

/* box */
.parentBox {display: inline-block;}
.parentBox-1,.parentBox-2 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.box2col,.box2col-ff,.box3col,.box4col {width: 100%;}
.parentBox .sbs47to48,
.parentBox .sbs47to48 img {width: 100%; max-width: 400px; vertical-align: middle;}
.parentBox-1 .box2col p:nth-child(1),
.parentBox-1 .box3col p:nth-child(1) {width: 15%; margin-right: 7%; vertical-align: middle;}
.parentBox-1 .box2col p:nth-child(2),
.parentBox-1 .box3col p:nth-child(2) {width: 70%; vertical-align: middle;}
.parentBox-1 .box4col {width: 100%; max-width: 310px; margin: 20px auto;}
.parentBox-2 .box4col {width: 100%; max-width: 300px; display: flex; margin: 20px auto;}
.parentBox-3 .box3col {width: 100%; max-width: 300px; display: flex; margin: 20px auto;}
.childBox-1 {width: 100%; max-width: 1000px; text-align: center; vertical-align: top; margin: 0 auto 50px;}
.childBox-1 p {vertical-align: top; margin: 0;}
.childBox-1 p:nth-child(1) {width: 13%; max-width: 60px; margin-right: 3%;}
.childBox-1 p:nth-child(2) {width: 82%;}
.childBox-1 img {width: 100%;}
.gradBox1 {
	position: relative;
	z-index: 1;
	left: 15px;
	margin: 0 auto;
	border-radius: 10px;
	width: 90%;
	max-width: 640px;
	height: 1000px;
	background: linear-gradient(212.63deg, #E7C2FF 0%, #A2DDF4 100%);
}
.innerBox1 {
	position: absolute;
	bottom: 15px;
  right: 15px;
	margin: 0 auto;
	width: 100%;
	max-width: 640px;
	height: 1000px;
	background: #fff;
	border-radius: 10px;
	padding: 8% 10%;
	box-shadow:-10px -10px 10px 0px rgba(53, 73, 171, 0.2);
}
.parentBox-1 .circle3col {
	width: 250px;
	height: 250px;
	border-radius: 50%;
	position: relative;
	margin: 0 auto 20px;
}
.parentBox-1 .circleInner {
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	padding: 10px;
}

/* ↓ 要素順番入れ替え ↓ */
.parentBox-CO {display: flex; flex-direction: column; align-items: center;}
.order1 { order: 2;}
.order2 { order: 1;}
/* ↑ 要素順番入れ替え ↑ */

/* SP非表示PC表示 */
.hide-show-pc-1,
.hide-show-pc-2,
.hide-show-pc-3 {display: none;}
.hide-show-sp-1 {display: block;}

/* フォント */
.roboto300 {font-family: 'Roboto', sans-serif; font-weight: 300;}
.roboto400 {font-family: 'Roboto', sans-serif; font-weight: 400;}
.roboto500 {font-family: 'Roboto', sans-serif; font-weight: 500;}
.roboto700 {font-family: 'Roboto', sans-serif; font-weight: 700;}
.roboto-con300 {font-family: 'Roboto Condensed', sans-serif; font-weight: 300;}
.roboto-con400 {font-family: 'Roboto Condensed', sans-serif; font-weight: 400;}
.roboto-con700 {font-family: 'Roboto Condensed', sans-serif; font-weight: 700;}
.notosans300 {font-family: 'Noto Sans JP', sans-serif; font-weight: 300;}
.notosans400 {font-family: 'Noto Sans JP', sans-serif; font-weight: 400;}
.notosans500 {font-family: 'Noto Sans JP', sans-serif; font-weight: 500;}
.notosans700 {font-family: 'Noto Sans JP', sans-serif; font-weight: 700;}
.notosans900 {font-family: 'Noto Sans JP', sans-serif; font-weight: 900;}
.dinCondensed-reg {font-family: din-condensed, sans-serif; font-weight: 400;}
.dinCondensed-700 {font-family: din-condensed, sans-serif; font-weight: 700;}

/* 背景色 */
.bg-fff {background: #fff;}
.bg-005bac {background: #005bac;} /* arukudock blue */
.bg-808080 {background: #808080;} /* 50% gray */
.bg-b3b3b3 {background: #b3b3b3;}
.bg-F4F6FA {background: #F4F6FA;} /* Light gray */
.bg-eee {background: #eee;} /* Light gray */
.bg-f6f6f6 {background: #f6f6f6;}
.bg-ebeef9 {background: #ebeef9;} /* Light blue */
.bg-6b90db {background: #6b90db} /* Light blue */
.bg-5782d9 {background: #5782d9} /* Light blue */
.bg-008ccf {background: #008ccf;}

/* border */
.bd-radius5 {border-radius: 5px;}
.bd-radius10 {border-radius: 10px;}
.bd-005bac-2px {border: 2px solid #005bac;} /* arukudock blue */
.bd-6b90db-2px {border: 2px solid #6b90db;}
.bd-519ced-3px {border-bottom: solid 3px #519ced;} /* lb */
.bb-fff-1px {border-bottom: 1px solid #fff;} /* fff */
.bb-656C81-1px {border-bottom: 1px solid #656C81;} /* gy */
.bb-grad5px {
  border-bottom: 5px solid #E7C2FF;
  border-image: linear-gradient(277.38deg, #E7C2FF 5.73%, #A2DDF4 94.27%);
  border-image-slice: 1;
}

/* hr */
.hr-434856w30h3 {border-top: 3px solid #434856; width: 30px;}

/* 文字色 */
.txt005bac {color: #005bac;} /* arukudock Blue */
.txt80e5ff {color: #80e5ff;} /* Light blue */
.txt6b90db {color: #6b90db;} /* Light blue */
.txt2965cc {color: #2965cc;}
.txt304280 {color: #304280;} /* FAQ Blue */
.txt434856 {color: #434856;} /* gy */
.txt656C81 {color: #656C81;} /* gy */
.txtfff {color: #fff !important;}
.txt333 {color: #333;}
.txt-bl {color: #0055a2;}
.txt-r {color: #cc0000;}
.m3blue {color: #001f66;}

/* 文字 */
.sectionTitle {
	text-align: center;
	font-size: clamp(50px, 6vw, 70px);
	line-height: 0.9;
}
.rboxTitle {
    padding: 10px 0;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    border-radius: 10px 10px 0 0;
}

/* 文字揃え */
.txtCenter {text-align: center !important;}
.txtLeft {text-align: left !important;}
.txtRight {text-align: right !important;}
.txtJustify {text-align: justify !important;}

/* 文字のサイズ */
.txt10 {font-size: 10px;}
.txt12 {font-size: 12px;}
.txt14 {font-size: 14px;}
.txt15 {font-size: 15px;}
.txt16 {font-size: 16px;}
.txt18 {font-size: 18px;}
.txt20 {font-size: 20px;}
.txt22 {font-size: 22px;}
.txt23 {font-size: 23px;}
.txt24 {font-size: 24px;}
.txt26 {font-size: 26px;}
.txt30 {font-size: 30px;}
.txt32 {font-size: 32px;}
.txt36 {font-size: 36px;}
.txt50 {font-size: 50px;}
.txt10to20 {font-size: clamp(10px, 3vw, 20px);}
.txt12to16 {font-size: clamp(12px, 3vw, 16px);}
.txt14to16 {font-size: clamp(14px, 3vw, 16px);}
.txt14to18 {font-size: clamp(14px, 3vw, 18px);}
.txt14to20 {font-size: clamp(14px, 3vw, 20px);}
.txt14to24 {font-size: clamp(14px, 3vw, 24px);}
.txt15to20 {font-size: clamp(15px, 3vw, 20px);}
.txt15to24 {font-size: clamp(15px, 3vw, 24px);}
.txt16to18 {font-size: clamp(16px, 3vw, 18px);}
.txt16to20 {font-size: clamp(16px, 3vw, 20px);}
.txt16to24 {font-size: clamp(16px, 3vw, 24px);}
.txt18to20 {font-size: clamp(18px, 3vw, 20px);}
.txt18to26 {font-size: clamp(18px, 3vw, 26px);}
.txt18to36 {font-size: clamp(18px, 3vw, 36px);}
.txt18to24 {font-size: clamp(18px, 3vw, 24px);}
.txt20to22 {font-size: clamp(20px, 3vw, 22px);}
.txt20to23 {font-size: clamp(20px, 3vw, 23px);}
.txt20to24 {font-size: clamp(20px, 3vw, 24px);}
.txt20to30 {font-size: clamp(20px, 3vw, 30px);}
.txt21to35 {font-size: clamp(21px, 3vw, 35px);}
.txt24to30 {font-size: clamp(24px, 3vw, 30px);}
.txt24to35 {font-size: clamp(24px, 3vw, 35px);}
.txt24to40 {font-size: clamp(24px, 3vw, 40px);}
.txt30to35 {font-size: clamp(30px, 3vw, 35px);}
.txt30to40 {font-size: clamp(30px, 3vw, 40px);}

/* 文字の太さ */
.fw-bold {font-weight: bold;}

/* 文字詰め */
.ls0pt05em {letter-spacing: 0.05em;}
.ls0pt08em {letter-spacing: 0.08em;}
.ls0pt1em {letter-spacing: 0.1em;}
.ls0pt2em {letter-spacing: 0.2em;}
.ls2 {letter-spacing: 2px;}
.lsmns0pt01em {letter-spacing: -0.01em;}
.lsmns0pt03em {letter-spacing: -0.03em;}
.lsmns0pt05em {letter-spacing: -0.05em;}

/* 見出し */
.heading1 {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}
.heading1::before,
.heading1::after {
	content: '';
	width: 3px;
	height: 40px;
	background-color: #005bac;
}
.heading1::before {
	margin-right: 30px;
	transform: rotate(-35deg)
}
.heading1::after {
	margin-left: 30px;
	transform: rotate(35deg)
}

/* padding */
.pdg5 {padding: 5px;}
.pdg10 {padding: 10px;}
.pdg15 {padding: 15px;}
.pdg20 {padding: 20px;}
.pdg10-10-20to0 {padding: 10px 10px 20px;}
.pdg25-10-40 {padding: 25px 10px 40px;}
.pdg300-10-40 {padding: 300px 10px 40px;}
.pdg50-10-0 {padding: 50px 10px 0;}
.pdg0-10-50 {padding: 0 10px 50px;}
.pdg0-20-50 {padding: 0 20px 50px;}
.pdg0-10-30 {padding: 0 10px 30px;}
.pdg0-5 {padding: 0 5px;}
.pdg0-10 {padding: 0 10px;}
.pdg0-20 {padding: 0 20px;}
.pdg0-30 {padding: 0 30px;}
.pdg5-0 {padding: 5px 0;}
.pdg8-0 {padding: 8px 0;}
.pdg10-0 {padding: 10px 0;}
.pdg20-0 {padding: 20px 0;}
.pdg30-0 {padding: 30px 0;}
.pdg30-20 {padding: 30px 20px;}
.pdg20-10 {padding: 20px 10px;}
.pdg50-10 {padding: 50px 10px;}
.pdg50-20 {padding: 50px 20px;}
.pdg60-10 {padding: 60px 10px;}
.pdg8per-0 {padding: 8% 0;}
.pdg4pt5-7pt5per {padding: 4.5% 7.5%;}
.pl0pt5em {padding-left:0.5em;}
.pl0pt8em {padding-left: 0.8em;}
.pl2pt7em {padding-left: 2.7em;}
.pl1em {padding-left:1em;}
.pl3pt5em {padding-left:3.5em;}
.pt20to40 {padding-top:20px;}
.pt5 {padding-top:5px;}
.pt25 {padding-top: 25px;}
.pb5 {padding-bottom:5px;}
.pb25 {padding-bottom:25px;}

/* margin */
.mt1300to500 {margin-top:1300px;}
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt60 {margin-top:60px;}
.mt13per {margin-top:13%;}
.mt30per {margin-top: 30%;}
.mt50per {margin-top: 50%;}
.mt-mns3per {margin-top: -3%;}
.mt-mns310 {margin-top: -310px;}
.mt10vh {margin-top: 10vh;}
.mt15vh {margin-top: 15vh;}
.mt50vh {margin-top: 50vh;}
.mb320-40 {margin-bottom:320px;}
.mb5 {margin-bottom: 5px;}
.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
.mb70 {margin-bottom:70px;}
.mb100 {margin-bottom:100px;}
.mb20per {margin-bottom: 20%;}
.mb100vh {margin-bottom: 100vh;}
.mb-mns300 {margin-bottom: -300px;}
.mr10 {margin-right: 10px;}
.mr40 {margin-right: 40px;}
.ml25 {margin-left: 25px;}
.ml8per {margin-left: 8%;}
.mlmns8per {margin-left: -8%;}
.mgn0-auto {margin:0 auto;}
.mgn0-at-50 {margin:0 auto 50px;}
.mgn0-at-100 {margin:0 auto 100px;}
.mgn0-5 {margin:0 5px;}
.mgn0-5-20 {margin:0 5px 20px;}
.mgn10 {margin: 10px;}
.mgn20 {margin: 20px;}
.mgn20-auto {margin:20px auto;}
.mgn60-auto {margin:60px auto;}
.mgn10-0 {margin: 10px 0;}
.mgn15-0 {margin: 15px 0;}
.mgn20-0 {margin: 20px 0;}
.variable-mgn1,.variable-mgn2 {margin: 15px 0;}

/* 改行 */
.brSP:before,
.brSPtoTB-S:before,
.brSPtoPC-L:before,
.brSPtoTB-M:before,
.tbl-br:before {
	content: "\A" ;
	white-space: pre ;
}

/* インデント */
.txtidt-0pt5em {text-indent:-0.5em;}
.txtidt-1em {text-indent:-1em;}
.indent-0pt5em {padding-left:0.5em; text-indent:-0.5em;}
.indent-0pt7em {padding-left:0.7em; text-indent:-0.7em;}
.indent-1em {padding-left:1em; text-indent:-1em;}
.indent-2em {padding-left:2em; text-indent:-2em;}
.indent-1pt3em {padding-left: 1.3em; text-indent: -1.3em;}
.indent-1pt35em {padding-left: 1.35em; text-indent: -1.35em;}
.indent-1pt4em {padding-left: 1.4em; text-indent: -1.4em;}
.indent-1pt45em {padding-left: 1.45em; text-indent: -1.45em;}
.indent-1pt5em {padding-left: 1.5em; text-indent: -1.5em;}
.indent-1pt6em {padding-left: 1.6em; text-indent: -1.6em;}
.indent-2pt8em {padding-left: 2.8em; text-indent: -2.8em;}
.indent-3em {padding-left:3em; text-indent:-3em;}
.indent-3pt3em {padding-left:3.3em; text-indent:-3.3em;}
.indent-4pt1em {padding-left: 4.1em; text-indent: -4.1em;}
.pl1pt8-idtMns1em {padding-left: 1.8em; text-indent: -1em;}

/* 行間 */
.lineHgt0pt8 {line-height: 0.8;}
.lineHgt1 {line-height: 1;}
.lineHgt1pt2 {line-height: 1.2;}
.lineHgt1pt5 {line-height: 1.5;}
.lineHgt2 {line-height: 2;}
.txtbetween2lines {display: block; margin-top: -25px;}

/* 高さ */
.hgt140 {height: 140px;}
.variable-hgt1 {height: 150px;}

/* vertical-align */
.va-top {vertical-align: top;}
.va-middle {vertical-align: middle;}

/* 上付き・下付き文字 */
.va-super {vertical-align: super; font-size: 0.5em;}
.va-sub {vertical-align: sub; font-size: 0.5em;}

/* 飾り */
.ornament {width: 100px; margin: 0 auto 10px;}

/* ブロック要素 */
.dp-bl {display:block !important;}
.dp-ilbl {display: inline-block;}

/* z-index */
.z-index1 {z-index: 1;}
.z-index2 {z-index: 2;}
.z-index3 {z-index: 3;}
.z-index4 {z-index: 4;}
.z-index5 {z-index: 5;}

/* z-index & position relative */
.pr-zindex1 {position: relative; z-index: 1;}
.pr-zindex5 {position: relative; z-index: 5;}

/* 現在地のナビの画像に半透明の色をかける */
.colorfilter-base {background-color: #4747b3;}
/* ナビのお申し込み・お問い合わせ部分を常にオレンジ */
.colorfilter-or {background:linear-gradient(to bottom, #ff9a4d 5%, #e64500 100%);}

/* boxShadow */
.bs-001980-pt2 {box-shadow: 0px 3px 20px rgba(0, 25, 128, 0.2);}

/* ボタン幅 */
.btn-width-1 {width: 100%; max-width: 400px;}
.btn-width-2 {width: 47%; max-width: 400px;}
.btn-width-3 {width: 310px;}
.appStore {width: 100%;}
.gglPlay {width: 100%;}
.appStore-parallel {width: 43.76%;}
.gglPlay-parallel {width: 54.23%;}

/* 通常ボタン */
.normalBtn-bdr {
	display: inline-block;
	border-radius: 26px;
}
.normalBtn {
	display: inline-block;
	padding: 8px 0;
}

/* フロートボタン */
.float-button,
.iphone .float-button,
.ipad .float-button {
	position: -webkit-sticky;
  position: sticky;
  bottom: 0;
	z-index: 5;
	padding: 10px 5px;
}

/* YOUTUBE埋め込み */
.youtube-wrap {
  max-width: 700px;
	margin-left: auto;
	margin-right: auto;
}
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

/*-------- ↓ googleform 埋め込み ↓ --------*/
#contactForm iframe{height:1600px;}
#signupForm iframe{height:2300px;}
@media only screen and (min-width: 360px){
	#contactForm iframe{height:1450px;}
	#signupForm iframe{height:2050px;}
}
@media only screen and (min-width: 460px){
	#contactForm iframe{height:1250px;}
	#signupForm iframe{height:1800px;}
}
@media only screen and (min-width: 560px){
	#contactForm iframe{height:1150px;}
	#signupForm iframe{height:1750px;}
}
@media only screen and (min-width: 660px){
	#signupForm iframe{height:1650px;}
}
/*-------- ↑ googleform 埋め込み ↑ --------*/

/*--------------------------- ↓ 利用規約 ↓ ---------------------------*/
.tosInner {max-width: 1000px; margin: 0 auto; text-align: center;}
.tosHead {font-family: 'Noto Sans JP', sans-serif; font-weight: 700; color: #005bac; font-size: 30px; margin-bottom: 40px;}
.tosSubhead {font-family: 'Noto Sans JP', sans-serif; font-weight: 700; color: #005bac;  font-size: 20px; margin-bottom: 25px;}
.tosInner p.lead {font-family: 'Noto Sans JP', sans-serif; font-weight: 500; margin-bottom: 40px;}
.tosInner p {font-size: 14px; line-height: 24px; color: #434856; text-align: justify;}
.tosSection {font-family: 'Noto Sans JP', sans-serif; font-weight: 500; margin-bottom: 30px;}
.tosSection:last-child {margin-bottom: 0;}
.tosSection a {color: #005bac;}
.tosSection ol {padding:0 0 0 14px;}
.tosSection ol li {font-size: 14px; line-height: 24px; color: #434856; text-align: justify; list-style-type: decimal; margin-bottom: 10px;}
.tosSection ol.parentheses1 {margin-top: 10px; padding-left: 1.6em; text-indent: -1.6em;}
.tosSection ol.parentheses2 {margin-top: 10px; padding-left: 1.4em; text-indent: -1.4em;}
.tosSection ol.parentheses1 li,
.tosSection ol.parentheses2 li {list-style-type:none; list-style-position:inside; counter-increment: cnt;}
.tosSection ol.parentheses1 li:before,
.tosSection ol.parentheses2 li:before {display: marker; content: "(" counter(cnt) ") ";}
.tosSection ol.parentheses3 {margin-top: 10px; margin-left: 1em;}
.tosSection ol.parentheses3 li {list-style-type: none; counter-increment: cnt;}
.tosSection ol.parentheses3 li::before {content: "(" counter(cnt) ")"; display: inline-block; margin-left: -2.5em; width: 2.5em;}
.tosSection ol.listStyle-none li {list-style-type:none; margin-left: 0.5em; padding-left: 1.3em; text-indent: -1.3em;}
/*--------------------------- ↑ 利用規約 ↑ ---------------------------*/

/*----------------- ↓ fadeUp ↓ -----------------*/
/* fadeUp */
.fadeUp{
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }
  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
.fadeUpTrigger {opacity: 0;}
/*----------------- ↑ fadeUp ↑ -----------------*/

/*----------------- ↓ swiper ↓ -----------------*/
.swiper-wrapper {width: 100%;}
.swiper-slide {width: 100%;}
.swiper-button-next,
.swiper-button-prev {color: #3bb9b0 !important;}
:root{--swiper-theme-color:#3bb9b0 !important;}
/* ページネーション形状・色 */
.swiper-pagination-bullet {
  border-radius: inherit !important;
  width: 14% !important;
  height: 5px !important;
  background: #3bb9b0 !important;
  opacity: 0.19 !important;
}
.swiper-pagination-bullet-active {
  background: #3bb9b0 !important;
  opacity: 1 !important;
}
/* ↓ 追加 ↓ */
.swiper-slide .txtCenter {text-align: center;}
@media only screen and (min-width: 760px){
	.slider1 .swiper-button-next {display: none;}
	.slider1 .swiper-button-prev {display: none;}
	.slider1 .swiper-pagination-bullet {display: none;}
}
/*----------------- ↑ swiper ↑ -----------------*/

/*------------- ↓ Q&Aアコーディオン ↓ -------------*/
.acd-check {display: none;}
.acd-label{
    background: #3bb9b0;
    color: #fff;
    display: block;
    padding: 12px;
    position: relative;
		height: 50px;
    line-height: 50px;
		border-radius: 5px;
		z-index: 1;
}
.acd-label:after {
    background: #00a197;
    box-sizing: border-box;
    content: '\f107';
    display: block;
    font-family: "Font Awesome 5 Free";
		font-weight: 900;
		font-size: 25px;
    padding: 0 20px;
    position: absolute;
    right: 0;
    top: 0px;
		height: 100%;
		border-radius: 0 5px 5px 0;
}
.acd-label p {
    width: 75%;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.2;
		position: absolute;
    top: 50%;
    /* left: 0%; */
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
		/* ↓ 追加 ↓ */
		padding-left: 1.8em;
    text-indent: -1.8em;
}
.acd-content {
		background: #e6faf5;
    display: block;
    height: 0;
    opacity: 0;
    padding: 0 12px;
    transition: .5s;
    visibility: hidden;
		border-radius: 5px;
}
.acd-content p {
	padding-left: 1.7em;
	text-indent: -1.7em;
}
.acd-check:checked + .acd-label:after {content: '\f106';}
.acd-check:checked + .acd-label + .acd-content {
    height: auto;
    opacity: 1;
    padding: 12px;
    visibility: visible;
}
@media only screen and (min-width: 560px) {
	.acd-label{padding: 20px;}
	.acd-label:after {padding: 0 20px;}
	.acd-label p {width: 87%;}
	.acd-content {padding: 0 20px;}
	.acd-check:checked + .acd-label + .acd-content {padding: 20px;}
}
@media only screen and (min-width: 760px) {
	.acd-label:after {
	    position: absolute;
	    top: 50%;
	    right: 0;
	    transform: translateY(-50%);
	    -webkit-transform: translateY(-50%);
	    -ms-transform: translateY(-50%);
	}
	.acd-label p {width: 90%;}
}
/*------------- ↑ Q&Aアコーディオン ↑ -------------*/

/*------------- ↓ ドロワーメニュー ↓ -------------*/
.gnav {
  height: 70px;
  /*padding: 0 5%;*/
  display: flex;
  justify-content: space-between;
  align-items: center;
	/*追加*/
	width: 100%;
	max-width: 1050px; /*1250px*/
	margin: 0 auto;
	background: #fff;
	padding-left: 2%;
	padding-right: 2%;
	color: #005bac;
}
.header-logo {
  width: 180px;
  height: auto;
}
.pcnav-ul {
  list-style: none;
  position: relative;
  display: flex;
}
.pcnav-ul li {margin-right: 25px;}
@media only screen and (min-width: 1260px) {
	.pcnav-ul li {margin-right: 30px;}
}
.pcnav-ul li a {
  display: block;
  font-weight: bold;
  padding-bottom: 3px;
}
.pcnav-ul li a:hover {
  color: #999;
  /* ホバー時の変化
	border-bottom: 1px solid #ccc;
  transition: 0s;
	*/
}
.pcnav-ul li:last-child {margin-right: 0px;}
.drawer {display: none;}
/* ↓ ハンバーガーメニュー　input ↓ */
.checkbox-hidden {display: none;}
.drawer label {
  width: 20px;
  height: 16px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
	position: absolute;
	top: 50%;
	right: 5.2%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}
.hamburger {z-index: 100;}
.hamburger span {
  display: block;
  width: 100%;
  height: 2px;
  background-color: #005bac;
  position: absolute;
  transition: transform 0.5s, opacity 0.5s, width 0.3s;
}
.hamburger span:nth-child(1) {top: 0;}
.hamburger span:nth-child(2) {
  top: 0;
  bottom: 0;
  margin: auto;
}
.hamburger span:nth-child(3) {bottom: 0;}
#navTgl:checked + .hamburger span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
  background-color: #005bac;
}
#navTgl:checked + .hamburger span:nth-child(2) {
  top: 0;
  bottom: 0;
  margin: auto;
  width: 0px;
  opacity: 0;
	background-color: #005bac;
}
#navTgl:checked + .hamburger span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
	background-color: #005bac;
}
.spnav {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 100%;
  opacity: 0;
  z-index: 99;
  background: #fff;
  transition: 0.5s ease-in-out;
}
/* ↓ ドロワーメニューのテキストの動き ↓ */
.spnav ul {
  text-align: center;
  margin-top: 110px;
}
.spnav ul li {
  position: relative;
  margin-bottom: 40px;
	/*
  transform: translateX(-200px);
  transition: transform 1.3s ease;
	*/
}
.spnav ul li:nth-child(2) {transition-delay: 0.15s;}
.spnav ul li:nth-child(3) {transition-delay: 0.3s;}
.spnav ul li:nth-child(4) {transition-delay: 0.45s;}
.spnav ul li a {
  font-size: 18px;
  color: #005bac;
}
#navTgl:checked ~ .spnav {
  left: 0;
  opacity: 1;
}
#navTgl:checked ~ .spnav li {
  transform: translateX(0px);
}
/* ↑ ドロワーメニューのテキストの動き ↑ */
@media only screen and (max-width: 959px) {
  .gnav {
    height: 55px;
    padding: 0 20px;
  }
	.gnav a {margin: 0 auto;}
  .header-logo {
    width: 120px;
    height: auto;
  }
  .pcnav-ul {display: none;}
  .drawer {
    display: block;
		position: relative; /* 追加 */
  }
}
/*------------- ↑ ドロワーメニュー ↑ -------------*/

/*--------- ↓ ドロワーメニュー sticky ↓ ---------*/
.menubar-sticky {
	width: 100%;
　position: -webkit-sticky;
	position: sticky;
	top: 0;
	/*box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);*/
	background: #fff;
	z-index: 6;
}
/*--------- ↑ ドロワーメニュー sticky ↑ ---------*/

/*----- ↓ 初回アクセス時のみポップアップウィンドウ表示 ↓ -----*/
.overlay {
display: none;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
position: fixed;
top: 0;
z-index: 101;
}
.btn_area {
width: 91%;
max-width: 800px;
border-radius: 10px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
background: #fff;
text-align: center;
padding: 50px 15px;
}
.btn_area .ttl {
font-weight: 700;
transform: rotate(0.05deg);
font-size: 20px;
color: #005bac;
text-align: center;
margin-bottom: 50px;
}
.btn_area p {
font-weight: 500;
transform: rotate(0.05deg);
color: #434856;
margin-bottom: 90px;
text-align: center;
}
.btn_area button {
width: 100%;
max-width: 480px;
font-weight: 500;
transform: rotate(0.05deg);
display: block;
margin: 0 auto;
background: #005bac;
color: #fff;
padding: 15px;
border: none
}
.btn_area button:hover {
background: #777
}
@media only screen and (min-width: 560px) {.btn_area .ttl {font-size: 24px;}}
/*----- ↑ 初回アクセス時のみポップアップウィンドウ表示 ↑ -----*/

/*=================== ↓ フローチャート ↓ ===================*/
/*--------- ↓ フローチャート（1～６カラム） ↓ ---------*/
/* ↓ 1・２・６カラム共通 ↓ */
ul {padding: 0;}
li {list-style-type: none;}
dd {margin-left: 0;}
/* ↑ 1・２・６カラム共通 ↑ */
.flow,.flow1to2col {display: block;}
.flow > li,
.flow1to2col > li {
	margin-bottom: 50px;
  position: relative;
}
.flow > li .icon {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
  font-size: 20px;
  line-height: 50px;
  width: 50px;
  color: #fff;
  background: rgb(107,144,219);
  margin: 0 auto 20px;
  display: block;
  border-radius: 50%;
  text-align: center;
  letter-spacing: 2px;
	position: absolute;
	top: 50%;
	left: 3%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	z-index: 1;
}
.flow > li dl,
.flow1to2col > li dl {
  padding: 30px 20px;
  margin: 0;
  border: 2px solid rgb(107,144,219);
  position: relative;
	background: #fff;
	border-radius: 10px;
}
.flow > li:not(:last-child) dl::before,
.flow1to2col > li:not(:last-child) dl::before {
    content: "";
    width: 14px;
    height: 14px;
		margin: 1.5%;
    display: inline-block;
    border-bottom: 4px solid rgb(102,213,233);
    border-right: 4px solid rgb(102,213,233);
    position: absolute;
    top: 120%;
    left: 47%;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.flow > li dl dt,
.flow1to2col > li dl dt {
  font-size: clamp(15px, 3vw, 20px);
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
  color: rgb(107,144,219);
  -ms-flex-preferred-size: 20%;
  flex-basis: 20%;
  margin-bottom: 1vh;
  text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	width: 100%;
}
@media only screen and (min-width: 560px) {
	.flow,.flow1to2col {
	  display: -webkit-box;
	  display: -ms-flexbox;
	  display: flex;
	  -webkit-box-pack: space-between;
	  -ms-flex-pack: space-between;
	  justify-content: space-between;
	}
	.flow > li {
	  -ms-flex-preferred-size: 14.5%;
	  flex-basis: 14.5%;
		margin-bottom: 0;
	}
	.flow1to2col > li {
		-ms-flex-preferred-size: 48%;
		flex-basis: 48%;
		margin-bottom: 0;
	}
	.flow > li .icon {
		position: relative;
    top: 20%;
    left: 0;
	}
	.flow > li .icon::before {
	  content: "";
	  border: solid transparent;
	  border-width: 8px;
	  border-top-color: rgb(107,144,219);
	  position: absolute;
	  top: calc(100% - 2px);
	  left: 50%;
	  -webkit-transform: translateX(-50%);
	  transform: translateX(-50%);
	}
	.flow > li dl {
	  margin: 4%;
		height: 70px;
	}
	.flow > li:not(:last-child) dl::before {
	  border-top: 4px solid rgb(102,213,233);
		border-bottom: none;
	  top: calc(55% - 10px);
	  left: 104%;
	}
	.flow1to2col > li:not(:last-child) dl::before {
	  border-top: 4px solid rgb(102,213,233);
		border-bottom: none;
	  top: calc(45% - 10px);
	  left: 100%;
	}
}
@media only screen and (min-width: 660px) {
	.flow > li dl {margin: 0;}
	.flow > li:not(:last-child) dl::before {left: 100%;}
	.flow1to2col > li:not(:last-child) dl::before {left: 101%;}
}
@media only screen and (min-width: 860px) {
	.flow > li:not(:last-child) dl::before {margin: 0 3.5%;}
}
@media only screen and (min-width: 1260px) {
	.flow > li:not(:last-child) dl::before {margin: 0 5%;}
}
/*--------- ↑ フローチャート（1～６カラム） ↑ ---------*/

/*-------------- ↓ フローチャート（1カラム） ↓ --------------*/
.flow1col > li {
	position: relative;
	text-align: left;
	font-size: 20px;
	font-weight: 500;
	color: #2965cc;
	border: 2px solid rgb(107,144,219);
	border-radius: 10px;
}
/* ↓ 5番目ふきだし ↓ */
.flow1col > li:nth-of-type(5) {
	border: 2px solid #5782d9;
	background: #5782d9;
	color: #fff;
}
.flow1col > li:nth-of-type(5) dl dt {color: #fff;}
.flow1col > li:nth-of-type(5) dl::before {
  border-width: 22px;
  border-top-color: #5782d9 !important;
}
.flow1col > li:nth-of-type(5) dl::after {
  border-width: 20px;
  border-top-color: #5782d9 !important;
}
/* ↑ 5番目ふきだし ↑ */
.flow1col > li:not(:last-child) {margin-bottom: 40px;}
.flow1col > li:not(:first-child)::before {
  content: "";
  height: 60px;
  display: block;
  border-left: 4px dotted #e5e5e5;
  position: absolute;
  top: -40px;
  left: 57px;
  z-index: 1;
}
.flow1col > li dl {
  width: 100%;
  padding: 15px 15px 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
}
.flow1col > li:not(:last-child) dl::before,
.flow1col > li:not(:last-child) dl::after {
  content: "";
  border: solid transparent;
  position: absolute;
  top: 100%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.flow1col > li:not(:last-child) dl::before {
  border-width: 22px;
  border-top-color: rgb(107,144,219);
}
.flow1col > li:not(:last-child) dl::after {
  border-width: 20px;
  border-top-color: #fff;
}
.flow1col > li dl dt {
  font-size: 20px;
  font-weight: 600;
  color: rgb(107,144,219);
  -ms-flex-preferred-size: 20%;
  flex-basis: 20%;
  margin-right: 5%;
  text-align: center;
}
.flow1col > li dl dt .icon {
  font-size: 16px;
  color: #fff;
  background: rgb(107,144,219);
  background: -moz-linear-gradient(left, rgba(107,144,219,1) 0%, rgba(102,213,233,1) 100%);
  background: -webkit-linear-gradient(left, rgba(107,144,219,1) 0%,rgba(102,213,233,1) 100%);
  background: linear-gradient(to right, rgba(107,144,219,1) 0%,rgba(102,213,233,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6b90db', endColorstr='#66d5e9',GradientType=1 );
  padding: 5px 10px;
  margin-bottom: 10px;
  display: block;
  border-radius: 20px;
  position: relative;
}
.flow1col > li dl dd {max-width: 450px;}
@media only screen and (min-width: 560px) {
	.flow1col > li:not(:first-child)::before {left: 67px;}
}
@media only screen and (min-width: 660px) {
	.flow1col > li:not(:first-child)::before {left: 77px;}
}
/*-------------- ↑ フローチャート（1カラム） ↑ --------------*/
/*=================== ↑ フローチャート ↑ ===================*/

/*--------- ↓ 「同意する」チェックボックス  ↓ ---------*/
.reservebtn-box{
	margin:0 auto;
	text-align:center;
	margin-bottom:30px;
}
.reserve-btn {
	display: block;
	margin: 0 auto;
	width: 100%;
	max-width: 650px;
	padding: 10px;
	margin-bottom: 10px;
	color: #fff;
	background: #005bac;
	border-radius: 10px;
	text-align: center;
	line-height: 1.5;
	font-size: clamp(18px, 3vw, 26px);
	font-family: 'Noto Sans JP', sans-serif; font-weight: 700;
}
.reserve-btn:hover {opacity: 0.5;}
.reserve-btn:disabled {
  color: #fff;
  background: #b3b3b3;
  pointer-events:none;
}
.agree-checkbox{
	display:block;
	text-align:center;
}
.check-mini-text{
	font-size:0.8em;
	display: inline-block;
	margin-bottom: 20px;
}
input#agree-check {margin-right: 1.2em;}
.agree-checkbox label:before {
	content:		'';
	width:			32px;
	height:			32px;
	display:		inline-block;
	background-color:	#fff;
	border: 2px solid #888;
	border-radius: 6px;
	vertical-align: middle;
}
/* 元のチェックボックスを非表示 */
.agree-checkbox input[type=checkbox] {display: none;}
/* チェックした時のスタイル */
.agree-checkbox input[type=checkbox]:checked + label:before {
  font-family: "Font Awesome 5 Free";
  content: '\f00c'; /* \2713 */
	font-weight: 600;
	font-size:		23px;
	color:			#fff;
	background-color:	#005bac;
	border: 2px solid #005bac;
	line-height: 28px;
}
/*--------- ↑ 「同意する」チェックボックス ↑ ---------*/

/*----------------------------------------
ヘッダー（スマホ）
----------------------------------------*/
#mainVisual {width: 100%;}
#mainVisual h1 {position: relative;}
#mainVisual img {width: 100%;}

/* ↓ headerCopy ↓ */
.headerCopy {
	display: none;
  position: relative;
	z-index: 1;
}
@media only screen and (min-width: 760px) {
	.headerCopy {
		display: block;
		width: 55%;
		max-width: 700px;
		position: absolute;
		top: 50%;
		left: 5%;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		}
}
@media only screen and (min-width: 960px) {.headerCopy {left: 7%; width: 50%;}}
/* ↑ headerCopy ↑ */

/* ↓ registration button ↓ */
.registrationBtn {
	position: absolute;
	top: 35%;
	left: 53%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
	width: 90%;
	max-width: 410px;
}
@media only screen and (min-width: 760px) {.registrationBtn {top: -75%; left: 34%; zoom: 70%;}}
@media only screen and (min-width: 960px) {.registrationBtn {top: -100%; left: 34%; zoom: 90%;}}
@media only screen and (min-width: 1160px) {.registrationBtn {top: -110%; left: 34%; zoom: 100%; max-width: 450px;}}
/* ↑ registration button ↑ */

/*----------------------------------------
コンテンツエリア（スマホ）　　
----------------------------------------*/
.container {
	text-align: center;
	position: relative;
}

#about-rv,
#example,
#charge {
	padding-top: 60px;
　margin-top: -60px;
}

#tos p {
	display: block;
	margin-bottom: 10px;
}
#tos .tosNo {
	color: #00a197;
	font-weight: bold;
}

.inSection {
	max-width: 1000px;
	margin: 0 auto /*30px*/;
	text-align: center;
}
.inSection p {
	display: inline-block;
	text-align: justify;
	/*vertical-align: middle;*/
}
.serviceInfo,
.application {
	display: inline-block;
	text-align: left;
	font-size: 18px;
}
.message p {
	text-align: center;
}

/* ↓ バルーン囲み ↓ */
.balloon-r,.balloon-l,.balloon-btm {
	position: relative;
	padding: 5%;
	font-size: clamp(16px, 3vw, 18px);
	background: #fff;
	border-radius: 15px;
	vertical-align: top;
	box-shadow: 0px 2px 30px rgba(53, 73, 171, 0.2);
}
.balloon-btm-ctr {
	position: relative;
	padding: 2% 4%;
	border-radius: 15px;
	vertical-align: top;
	max-width: 500px;
}

/* ↓ バルーン右向き ↓ */
.balloon-r:before {
	content: "";
	position: absolute;
	top: 20%;
	left: 100%;
	border: 7px solid transparent;
	border-left: 12px solid #fff;
}
/* ↓ バルーン左向き ↓ */
.balloon-l:before {
  content: "";
  position: absolute;
  bottom: 80%;
  right: 100%;
  border: 7px solid transparent;
  border-right: 12px solid #fff;
}
/* ↓ バルーン下向き ↓ */
.balloon-btm:before {
	content: "";
	position: absolute;
	top: 100%;
	right: 20%;
	border: 7px solid transparent;
	border-top: 12px solid #fff;
}
/* ↓ バルーン下向き中央 ↓ */
.balloon-btm-ctr:before {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	border: 7px solid transparent;
	border-top: 12px solid #005bac;
}

/*チェック項目BOX*/
.notestyleBox {
  padding: 1em 2em;
  margin: 2em 0;
  background: #FFF;
  border: 2px solid #005bac;
  border-radius: 10px;
	text-align: justify;
	margin: 0 auto;
	max-width: 845px;
	box-shadow: 0px 3px 20px rgba(0, 25, 128, 0.2);
}
.notestyleBox p {
  margin: 0;
  padding: 0;
	color: #005bac;
	font-size: clamp(18px, 3vw, 25px);
	font-family: 'Noto Sans JP', sans-serif; font-weight: 500;
}
.notestyleBox ul li {
	background: url(../img/check-square-regular-bl.svg) left center no-repeat;
	background-size: 1.8em auto;
	padding: 10px 0 14px 50px;
	border-bottom: 1px dashed #8c8c8c;
}
.notestyleBox ul li:last-child {border-bottom: none;}

.userIll {width: 18%;}

.mw450img {
	width: 100%;
	max-width: 450px;
	display: block;
	margin: 0 auto;
}
.mw700img {
	width: 100%;
	max-width: 700px;
	display: block;
	margin: 0 auto;
}

/* ↓ テーブル（表組/tbl-1） ↓ */
.tbl-1,
.tbl-2 {
	max-width: 850px;
  margin: 10px auto;
	border: solid 1px #ccc;
}
.tbl-1 th {
	height: 40px;
	line-height: 40px;
	padding: 0 10px;
	color: #443737;
  background: #c2daf2;
	border-right: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
}
.tbl-2 th {
	line-height: 1.5;
	padding: 10px;
	color: #443737;
  background: #c2daf2;
	border-right: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
	width: 36%;
}
.tbl-1 td {
	text-align: left;
	height: 40px;
	line-height: 40px;
	padding: 0 10px;
	background: #f6f6f6;
	border-bottom: solid 1px #ccc;
}
.tbl-2 td {
	text-align: left;
	line-height: 1.5;
	padding: 10px;
	background: #f6f6f6;
	border-bottom: solid 1px #ccc;
}
.last th,
.last td {border-bottom: none;}
@media screen and (max-width: 599px) {
  .tbl-1,
	.tbl-2 {width: 100%;}
	.tbl-1 th {
		text-align: center;
		border-right: none;
		display: block;
	}
	.tbl-2 th {
		width: 100%;
		text-align: center;
		border-right: none;
		display: block;
	}
	.tbl-1 td {
		text-align: center;
		display: block;
	}
	.tbl-2 td {
		text-align: left;
		display: block;
	}
	.tbl-2 td.tdCtr {
		text-align: center;
		display: block;
	}
	.last th {
		text-align: center;
		border-bottom: solid 1px #ccc;
	}
}
/* ↑ テーブル（表組） ↑ */

/* ↓ ページトップ ↓ */
p#pageTop {
	position: fixed;
	bottom: 10px;
	right: 5px;
	z-index: 5;
}
p#pageTop a {
	display:block;
	text-align:center;
	width:60px;
	height:60px;
	line-height: 60px;
	color: #fff;
	text-decoration: none;
	font-size: 2.5em;
	border-radius: 50%;
	background-color: rgba(128,128,128,.9);
	transition: all .5s linear;
}
p#pageTop a:hover {
	text-shadow: -1px -1px 1px rgba(0,0,0,.3);
	box-shadow: 1px 1px 2px rgba(0,0,0,.3);
	background-color: #000;
	color:#FFF;
}
p#pageTop a span {
	font-weight: bold;
	font-size: 2em;
}
/* ↑ ページトップ ↑ */

/*----------------------------------------
フッター（スマホ）
----------------------------------------*/
#ad-footer {padding: 30px 10px 10px;}
#ad-footer .upperFoot p {
	text-align: center;
	font-size: 15px;
	margin-bottom: 10px;
}
#ad-footer .upperFoot p a {color: #005bac;}
#ad-footer small {
	color: #005bac;
	font-size: 0.7em;
}
.lowerFoot {text-align: center;}

/*========================================
　タブレット 560〜959px
========================================*/
@media only screen and (min-width: 560px){
	/*----------------------------------------
	全体
	----------------------------------------*/
	.pt20to40{padding-top:40px;}
	.mt1300to500 {margin-top:650px;}
	.variable-mgn1 {margin: 15px 0 45px;}

	.brSPtoTB-S:before {display: none;}
	.brTBtoPC-S:before,
	.brTB-StoTB-M:before,
	.br560 {
		content: "\A" ;
		white-space: pre ;
	}

	.btn-width-3 {width: 450px;}

	/*----------------------------------------
	コンテンツエリア（タブレット）　　
	----------------------------------------*/
	.userIll {width: 13%;}
	.appStore {max-width: 242px;}
	.gglPlay {max-width: 299.86px;}
	.appStore-parallel {max-width: 242px;}
	.gglPlay-parallel {max-width: 299.86px;}

	.parentBox .sbs47to48,.parentBox .sbs47to48 img {max-width: 600px;}
	.parentBox-1 .box2col {width: 49%; margin-right: 1%;}
	.parentBox-1 .box2col-ff {width: 45%; margin-right: 10%;}
	.parentBox-1 .box3col {width: 32%; margin-right: 2%;}
	.parentBox-1 .box2col:last-child,
	.parentBox-1 .box2col-ff:last-child,
	.parentBox-1 .box3col:last-child {margin-right: 0;}
	.parentBox-1 .box2col p:nth-child(1),
	.parentBox-1 .box3col p:nth-child(1) {width: 100%; margin: 0 0 20px;}
	.parentBox-1 .box2col p:nth-child(2),
	.parentBox-1 .box3col p:nth-child(2) {width: 75%; margin: 0 auto;}
	.parentBox-1 .box4col {width: 46%; max-width: none; margin: 2%;}
	.parentBox-3 .box3col {max-width: 335px;}
	.gradBox1,.innerBox1 {height: 750px;}
}

@media only screen and (min-width: 600px) {
	.tbl-br2:before {
		content: "\A" ;
		white-space: pre ;
	}
}

/*========================================
　タブレット 760px〜959px
========================================*/
@media only screen and (min-width: 760px) {
	/*----------------------------------------
	全体（タブレット）
	----------------------------------------*/
	a.anchor {padding-top: 90px; margin-top: -90px;}

	.hide-show-pc-1 {display: block;}
	.hide-show-sp-1 {display: none;}

	.brSPtoTB-M:before,
	.brTB-StoTB-M:before,
	.tbl-br:before,
	.tbl-br2:before {display: none;}
	.brTB:before {
		content: "\A" ;
		white-space: pre ;
	}

	.bg-lbl-wh {background: #fff;}

	.pdg10-10-20to0 {padding: 10px 10px 0;}
	.variable-mgn2 {margin: 15px 0 45px;}
	.mb320-40 {margin-bottom: 40px;}

	.txtbetween2lines {display: block; margin-top: -40px; margin-left: 280px;}

	.w100to140 {width: 140px;}

	.balloon-l:before {bottom: 20%;}

	/*----------------------------------------
	ヘッダー（タブレット）
	----------------------------------------*/
	.btn-on-mv {
		width: 35%;
		position: absolute;
		top: -12%;
    left: 7%;
	}

	/*----------------------------------------
	コンテンツエリア（PC）　
	----------------------------------------*/
	.userIll {width: 8%;}

	.parentBox-1 .box4col,
	.parentBox-2 .box4col {width: 42%; max-width: none; margin: 4%;}
	.parentBox-3 .box3col {max-width: 406px;}
	.parentBox .sbs47to48:nth-of-type(1) {width: 47%; margin-right: 4.2%;}
	.parentBox .sbs47to48:nth-of-type(2) {width: 48%;}
	.gradBox1,.innerBox1 {height: 700px;}

	/* ↓ 要素順番入れ替え ↓ */
	.parentBox-CO {flex-direction:row;}
	.order1 {order: 1;}
	.order2 {order: 2;}
	.order3 {order: 3;}
	/* ↑ 要素順番入れ替え ↑ */

	/* フロートボタン */
	.float-button,
	.iphone .float-button,
	.ipad .float-button {display: none;}

	/*----------------------------------------
	フッター（タブレット）
	----------------------------------------*/
	#ad-footer {text-align: center;}
	#ad-footer .upperFoot p {
		display: inline-block;
		margin: 10px;
	}
}

/*========================================
　PC 960px以上
========================================*/
@media only screen and (min-width: 960px) {
	/*----------------------------------------
	全体（タブレット）
	----------------------------------------*/
	.mt1300to500 {margin-top:500px;}
	.variable-mgn1,.variable-mgn2 {margin: 15px 0;}
	.variable-hgt1 {height: 80px;}

	.brTBtoPC-S:before {display: none;}

	.hide-show-pc-2 {display: block;}

	.parentBox-2 {width: 960px; margin: 0 auto;}
	.parentBox-3 {width: 950px; margin: 0 auto;}
	.parentBox-2 .box4col {max-width: 300px; margin-top: -20px;}
	.parentBox-2 .box4col:nth-of-type(1) {margin-right: 0;}
	.parentBox-2 .box4col:nth-of-type(2) {margin-top: 150px;}
	.parentBox-2 .box4col:nth-of-type(3) {margin-top: 300px;}
	.parentBox-2 .box4col:nth-of-type(4) {margin-top: 450px;}
	.parentBox-2 .box4col:not(:first-child) {margin-left: -15%;}
	.parentBox-3 .box3col {max-width: 410px; margin-top: -20px;}
	.parentBox-3 .box3col:nth-of-type(1) {margin-left: 0;}
	.parentBox-3 .box3col:nth-of-type(3) {margin-right: 0;}
	.parentBox-3 .box3col:nth-of-type(4) {margin-left: 0; margin-top: -100px;}
	.parentBox-3 .box3col:nth-of-type(5) {margin-top: 10px;}
	.parentBox-3 .box3col:nth-of-type(6) {margin-right: 0; margin-top: 10px;}

	.btn-on-mv {
    position: absolute;
    top: -15%;
    left: 6.5%;
	}

	/*----------------------------------------
	コンテンツエリア（PC）　　
	----------------------------------------*/
	.userIll {width: 6%;}

	.parentBox-1 .box4col {width: 23.5%; margin: 0;}
	.parentBox-1 .box4col:not(:last-child) {margin-right: 2%;}

}

/*========================================
　PC 1160px以上
========================================*/
@media only screen and (min-width: 1160px) {
	.hide-show-pc-3 {display: block;}
	.brSPtoPC-L:before {display: none;}
	.btn-on-mv {
		width: 32%;
    position: absolute;
    top: -18%;
    left: 9%;
	}
	.parentBox-2 {width: 1160px; margin: 0 auto;}
	.parentBox-2 .box4col {max-width: 370px;}
}