@charset "UTF-8";
@media screen and (max-width: 640px) {
  .spNone { display: none; }
  .content { width: 100%; }
  .noteArea { padding: 10px; }
  .attention { padding: 40px 0 0; }
  .attention h5 { font-weight: bold; font-size: 22px; margin: 0 0 20px; }
  .kv { background: url("/static/images/flow/kv_chara.png") center 40px no-repeat #fff2f1; background-size: 40px auto; padding: 20px 0; margin-top: 0; }
  .kv h1 { padding: 90px 0 0; margin: 0 0 30px; font-size: 26px; }
  .kv .kvStep { width: 90%; margin: 0 auto 20px; }
  .kv .txtWrap { /*width: 90%;*/ /*margin: 0 auto;*/ margin: 15px 0 0; width: 100%; position: relative; box-sizing: border-box; padding: 0 15px; display: flex; flex-wrap: wrap; align-items: center; box-sizing: border-box; }
  .kv .txtWrap p { font-weight: bold; font-size: 16px; text-align: left; margin: 0; }
  .kv .txtWrap .yotei { font-size: 16px; padding: 5px 0 10px 30px; width: 60%; box-sizing: border-box; }
  .kv .txtWrap .today { width: 40%; padding: 10px 0; box-sizing: border-box; font-size: 16px; position: relative; margin: 0 0 15px; }
  .kv .txtWrap .today span { font-size: 16px; }
  .kv .txtWrap .alert { display: block; width: 100%; margin-top: 15px; text-align: center; }
  .kv dl { width: auto; margin: 0 15px 0; box-sizing: border-box; display: block; }
  .kv dl dt { display: block; vertical-align: top; text-align: center; }
  .kv dl dd { display: block; padding: 5px 10px; margin: 0; }
  /*kv*/
  section h2 { padding: 25px 0; font-size: 20px; }
  section .charaH2 { font-size: 20px; text-align: center; padding: 70px 0 24px; margin: 0; }
  section .inner { width: 90%; margin: 0 auto; padding: 40px 0 35px; }
  section .inner.wifiArea { padding: 20px 15px; margin: 30px auto 0; background: #fff; }
  section .inner.wifiArea p.wifiLead { font-size: 18px; }
  section .inner.wifiArea .ttlArea { margin: 20px 0; padding: 30px 10px 20px; position: relative; text-align: center; z-index: 1; }
  section .inner.wifiArea .ttlArea p { font-size: 16px; }
  section .inner.wifiArea .ttlArea p span { font-size: 28px; }
  section .inner.wifiArea .ttlArea div { position: static; text-align: center; top: 0; left: 0; margin: 12px auto 0; }
  section .inner.wifiArea .ttlArea:before { position: absolute; width: 0; height: 0; border-style: solid; border-width: 16px 22px 0 22px; border-color: #ffffff transparent transparent transparent; top: 0; left: 50%; margin-left: -22px; content: ""; }
  section .inner.wifiArea .wifiInside { width: 100%; margin: 20px auto; }
  section .inner.wifiArea .wifiInside .priceBlock { padding: 15px 5px; font-size: 16px; margin-top: 10px; }
  section .inner.wifiArea .wifiInside .priceBlock span { font-size: 14px; }

  .wrapper .secFlow .inner .attentionArea { padding:30px 10px 10px; }
  .wrapper .secFlow .inner .attentionArea h5 { margin: 0 0 0; }

}
@media screen and (max-width: 640px) and (max-width: 500px) { section .inner.wifiArea .wifiInside .wifiList li { width: 85px; height: 85px; font-size: 15px; } }
@media screen and (max-width: 640px) and (max-width: 435px) { section .inner.wifiArea .wifiInside .wifiList li { width: 70px; height: 70px; font-size: 11px; } }
@media screen and (max-width: 640px) and (max-width: 365px) { section .inner.wifiArea .wifiInside .wifiList li { width: 60px; height: 60px; font-size: 10px; } }

@media screen and (max-width: 640px) { .secMovie { padding-bottom: 30px; width: 90%; margin: 0 auto; }
  .wrapper .secMovie div { position: relative; width: 100%; padding-top: 56.25%; }
  .wrapper .secMovie div iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }
  .wrapper .secFaq h2.charaH2 { background-size: 40px auto; }
  .wrapper .secFaq h3 { font-weight: bold; font-size: 18px; margin: 45px 0 20px; }
  .wrapper .secFaq h3.first { margin: 0 0 10px; }
  .wrapper .secFaq dl { margin: 0 0 30px; }
  .wrapper .secFaq dl dt { background: url("/static/images/flow/faq_q.png") no-repeat left 20px top 25px; padding: 25px 60px; font-size: 18px; }
  .wrapper .secFaq dl dt:after { right: 30px; top: 30px; height: 10px; }
  .wrapper .secFaq a.allBtn { width: 100%; background: #fff url("/static/images/flow/faq_arrow2.png") right 30px center no-repeat; background-size: 18px auto; font-size: 20px; padding: 24px 0; }
  /*secFaq*/
  .wrapper .secTab { padding: 35px 0; margin-bottom: 15px; }
  .wrapper .secTab h2.charaH2 { background-size: 40px auto; font-size: 1.2rem; }
  .wrapper .secTab ul.tabList { /*li*/ }
  .wrapper .secTab ul.tabList li { width: 50%; padding: 70px 0 8px; font-size: 18px; /*on*/ }
  .wrapper .secTab ul.tabList li:after { position: absolute; left: 50%; margin-left: -28px; top: 10px; }
  .wrapper .secTab ul.tabList li.kodate:after { content: url("/static/images/tab_ico_kodate.svg"); }
  .wrapper .secTab ul.tabList li.shugou:after { content: url("/static/images/tab_ico_shugou.svg"); }
  .wrapper .secTab ul.tabList li.on { padding: 80px 0 14px; }
  .wrapper .secTab .tabContent { width: 90%; padding: 20px 0 0; }
  .wrapper .secTab .redBtn { padding: 20px 10px; display: block; width: 90%; margin: 30px auto; }
  .wrapper .secTab .redBtn span { margin-top: 5px; }
  .wrapper .secTab .imgArea { text-align: center; border: 2px solid #c6c6c6; padding: 24px 14px; }
  /*secTab*/
  .wrapper .secFlow { background: #fefade; padding: 35px 0; }
  .wrapper .secFlow h2.charaH2 { background-size: 40px auto; }
  .wrapper .secFlow .inner { width: 90%; margin: 0 auto; background: none; box-sizing: border-box; padding: 0; text-align: left; /*article*/ }
  .wrapper .secFlow .inner article { background: #fff; padding: 20px 15px; position: relative; margin-bottom: 80px; /*h3*/ }
  .wrapper .secFlow .inner article:after { position: absolute; background: url("/static/images/flow/flow_arrow_sp.png"); background-size: 100%; content: ""; width: 19px; height: 42px; bottom: -60px; left: 50%; margin-left: -10px; }
  .wrapper .secFlow .inner article:last-child { margin-bottom: 0; }
  .wrapper .secFlow .inner article:last-child:after { content: none; }
  .wrapper .secFlow .inner article h3 { font-size: 18px; margin: 0 0 20px; }
  .wrapper .secFlow .inner article h3 span { display: table-cell; padding-right: 10px; }
  .wrapper .secFlow .inner article h3 span:first-child { width: 50px; }
  .wrapper .secFlow .inner article h3 span:first-child img { max-width: 100%; }
  .wrapper .secFlow .inner article .articleInner { padding: 0 0 20px 0; margin: 0; border-left: none; }
  .wrapper .secFlow .inner article .articleInner:after { content: none; }
  .wrapper .secFlow .inner article .step2Inner dl { width: 100%; padding: 0 0 0 24px; }
  .wrapper .secFlow .inner article .step2Inner figure { width: 100%; padding: 25px 0 30px 0; text-align: center; }
  .wrapper .secFlow .inner article .step5Inner { display: flex; flex-wrap: wrap; }
  .wrapper .secFlow .inner article .step5Inner div { width: 100%; }
  .wrapper .secFlow .inner article .step5Inner figure { width: 100%; padding: 0; text-align: center; }
  .wrapper .secFlow .inner article .step5shugoInner { display: flex; flex-wrap: wrap; }
  .wrapper .secFlow .inner article .step5shugoInner div { width: 100%; }
  .wrapper .secFlow .inner article .step5shugoInner figure { width: 100%; padding: 0; text-align: center; }
  .wrapper .secFlow .inner article .tachiaiBox { margin-left: 30px; padding: 15px; margin-bottom: 35px; }
  .wrapper .secFlow .inner article .tachiaiBox:before { bottom: -2px; left: -28px; content: ""; width: 55px; height: 78px; background: url("/static/images/flow/flow_chara2.png") no-repeat center bottom; background-size: 100%; }
  .wrapper .secFlow .inner article .tachiaiBox h4 { font-size: 16px; margin: 0 0 14px; }
  .wrapper .secFlow .inner article .accArea { margin-bottom: 10px; position: relative; margin-top: 0px; padding: 20px 0 0px; }
  .wrapper .secFlow .inner article .accArea h4 { font-size: 20px; margin: 0 0 20px 0; padding-left: 40px; padding-right: 40px; }
  .wrapper .secFlow .inner article .accArea h4 span { left: 0px; top: 0px; }
  .wrapper .secFlow .inner article .accArea h4:after { content: ""; background: url("/static/images/flow/flow_ico_acc.png"); position: absolute; -moz-transition: -moz-transform 0.2s linear; -webkit-transition: -webkit-transform 0.2s linear; -o-transition: -o-transform 0.2s linear; -ms-transition: -ms-transform 0.2s linear; transition: transform 0.2s linear; transform-origin: 50% 50%; right: 5px; top: 5px; height: 16px; width: 16px; line-height: 0; background-size: 100%; }
  .wrapper .secFlow .inner article .accArea .accBtn { position: relative; cursor: pointer; pointer-events: auto; padding-bottom: 10px; 				/*&:after {
							content:"";
							background:url("/static/images/flow/flow_arrow_acc.png");
							position: absolute;
							-moz-transition: -moz-transform 0.2s linear; 						-webkit-transition: -webkit-transform 0.2s linear; 						-o-transition: -o-transform 0.2s linear; 						-ms-transition: -ms-transform 0.2s linear; 						transition: transform 0.2s linear; 						transform-origin: 50% 50%; 						right: 5px; 						top: 5px; 						height: 9px; 						width:16px; 						line-height: 0; 						background-size: 100%;
					}
				&.on:after {
							-moz-transform: rotateX(180deg); 						-webkit-transform: rotateX(180deg); 						-o-transform: rotateX(180deg); 						-ms-transform: rotateX(180deg); 						transform: rotateX(180deg); 						transform-origin: 50% 50%;
					}*/ }
  .wrapper .secFlow .inner article .accArea .accBtn:after { content: "続きを読む"; position: absolute; bottom: 0px; left: 40px; color: #4a7ab2; opacity: 1.0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
  .wrapper .secFlow .inner article .accArea .accBtn.on:after { opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
  .wrapper .secFlow .inner article .accArea .accBtn.on h4:after { -moz-transform: rotate(315deg); -webkit-transform: rotate(315deg); -o-transform: rotate(315deg); -ms-transform: rotate(315deg); transform: rotate(315deg); transform-origin: 50% 50%; }
  .wrapper .secFlow .inner article .accArea .accBtn p:after { content: none; }
  .wrapper .secFlow .inner article .accArea p { padding: 0; }
  .wrapper .secFlow .inner article .accArea .accContent { display: none; }
  .wrapper .secFlow .inner article .accArea .accContent ul { margin-left: 0; }
  .wrapper .secFlow .inner article .accArea .accContent .imgTable { margin-bottom: 30px; }
  .wrapper .secFlow .inner article .accArea .accContent .imgTable th { padding: 10px 5px; }
  .wrapper .secFlow .inner article .accArea .accContent .imgTable td { padding: 10px; }
  .wrapper .secFlow .inner article .accArea .accContent .imgTable td p { margin-top: 15px; font-size: 12px; padding: 0; }
  .wrapper .secFlow .inner article .accArea .accContent .accCloce { color: #fff; display: block; border-radius: 20px; padding: 10px; line-height: 100%; margin: 20px auto 0; cursor: pointer; font-weight: bold; background: #808080; width: 120px; text-align: center; }
  .wrapper .secFlow .inner article .accArea .accContent .accCloce:hover { opacity: 0.8; }
  .wrapper .secFlow .complete { background: #fff; padding: 10px; margin-bottom: 40px; }
  /*.secFlow*/
  .wrapper .secSearch { background: #f6f6f6; padding: 20px 0 35px; }
  .wrapper .secSearch h3 { font-size: 20px; padding: 50px 0 15px; background: url("/static/images/flow/search_chara.png") center top no-repeat; background-size: 30px auto; margin: 10px 0 0; }
  .wrapper .secSearch .searchBox { width: 90%; }
  .wrapper .secSearch .searchBox input { padding: 8px; width: 80%; margin-right: 4%; }
  .wrapper .secSearch .searchBox a { width: 16%; }
  .wrapper .secSearch a.convBtn { width: 90%; font-size: 18px; padding: 16px 16px 16px 50px; }
  .wrapper .secSearch a.convBtn:before { left: 20px; }
  .wrapper .secSearch dl { text-align: center; margin: 30px auto 0; width: 90%; display: block; }
  .wrapper .secSearch dl dt { font-weight: bold; padding: 0; display: block; margin: 0; }
  .wrapper .secSearch dl dd { display: block; text-align: left; }
  #footArea { background: #262626; border-top: 1px #cccccc solid; color: #ffffff; margin: 49px 0 0; padding: 16px 0 16px; text-align: center; width: 100%; }
  .bottomNote { padding-top: 30px; }
}
.elementFooter .pagetop { z-index: 9999; }

/*# sourceMappingURL=flow_sp.css.map */