@charset "UTF-8";
/* CSS Information ===========
File name:guide.css
Description:SPM Cloud [front-user]
D&M/IJU Inc.
Date: 2018
Contents: *guide Only *Static
Root Em:100%
=============================== */
/*Public*/
.nowrap {white-space: nowrap;}
.header__inner{text-align:center;}
_:-ms-fullscreen, :root .header__inner{padding-top:2.5rem;}/*IE11*/
.breadcrumb__progress{text-align:center;}
.facility__id{padding-right:0; width:100%; -webkit-width:calc(100% - 0); width:calc(100% - 0);}
.a--disabled{pointer-events:none;}
.double--line{text-decoration:underline double;}
/*Only*/
.guide__wrap{padding:0;}
.guide__inner{width:100%; max-width:77.5rem; margin:0 auto; padding:2.5rem 0; border-top:solid 0.0625rem #ccc; border-bottom:solid 0.0625rem #ccc;}/*1240*/
.guide__inner.border--not{border-top:0; padding-top:0;}
/*Parts*/
.guide__box{width:100%; margin-bottom:2.5rem;}
.guide__box:last-child{margin-bottom:0;}
.guide__box__clm{padding:1.25rem 0.625rem 0.625rem;}
.guide__facility_name {font-size:1.25rem; margin-bottom: .5em;}
.guide__box a{text-decoration:underline; background:#cce5ff; padding:0 0.3125rem;}
.guide__item{font-size:1.625rem; border-bottom:solid 0.0625rem #ccc;}
.border--none{border:0;}
.guide__subitem{font-size:1.375rem; margin-bottom:0.625rem; color:#666;}
.guide__facility{font-size:1.25rem; margin-bottom:0.625rem;}
.guide__subitem > span{display: inline-block; white-space: nowrap}
.guide__note{font-size:1.125rem; margin-bottom:0.625rem;}
.guide__list{font-size:1.125rem; margin-bottom:0.625rem;}
.guide__list li{text-indent: -1.2em; padding-left: 1em;}
.guide__list__sub{margin:0.625rem 0;}
.page__jump a{width:100%; border-width:0.125rem;}
.guide__tab{width:100%;}
.guide__tab.fixed-width{table-layout: fixed;}
.guide__tab th,.guide__tab td{border:solid 1px #ccc; padding:0.9375rem; font-size:1.125rem;}
.guide__tab thead th{background:#e7e7e7;}
.guide__tab th span .guide__tab td span{display:inline-block;}
/* Env */
.tab--spec th{min-width:10.625rem;}
.tab--spec tbody th{background:#f7f7f7;}
/* Step */
.guide__step{width:100%;}
.guide__step__field{width:100%;}
.guide__step__field:after{font-family:"FontAwesome"; content:"\f063"; font-size:1.25rem; margin-left:2.5rem;}
.guide__step__field:last-child:after{content:none;}
.guide__step__box{width:100%;}
.guide__step__count{width:6.25rem; background:#cce5ff; text-align:center; padding:0.625rem;}
.guide__step__item{width:90.234675%; -webkit-width:calc(100% - 6.25rem); width:calc(100% - 6.25rem); font-size:1.375rem; padding:0.625rem;}
.guide__step__item span{display:inline-block;}
/* Button */
.guide__jump__wrap{width:100%; margin-bottom:3.125rem;}
.guide__jump__wrap .page__jump{width:50%; padding:0 0.625rem;}
.guide__approval{width:100%; background:#f7f7f7; padding:0.625rem; text-align:center; margin-bottom:0.9375rem;}
.guide__approval a{text-decoration:underline;}
#js--guide--btn{display:none;}
/* Wellcome */
.guide__unique{width:100%;}
.guide__unique__box{width:50%; padding:1.25rem; background:#f7f7f7;}
.guide__unique__box:nth-of-type(2){border-left:solid 0.0625rem #ccc;}
.guide__unique__icon{width:100%; display:block; margin-bottom:1.25rem; text-align:center;}
.guide__unique__icon img{max-width:10rem;}
.guide__unique__disc{text-align:center;}
.guide__unique__disc span{display:inline-block;}
.tab--service tbody th{width:33%; text-align:left; background:#f7f7f7;}
.tab--facility tbody td{text-align:center;}
.tab--facility tbody tr:nth-child(even){background:#f7f7f7;}
.tab--facility thead th{width:13%;}
.tab--facility thead th:first-child{width:22%;}
.tab--facility thead th span{display:block;}
.tab--overflow{width:100%; margin-bottom:0.625rem;}
.tab--overflow + .tab--overflow--help + .tab--overflow{margin-top:2rem;}
.tab--overflow--help{margin-bottom:0.625rem; display:none;}
.tab--overflow--help span{margin:0 0.625rem;}
/* Guide */
.guide__flip .guide__flip__contents{margin-bottom:2.5rem;}
.guide__flip .guide__subitem{color:#4e83bb;}
.guide__flip__contents{width:100%;}
.guide__flip__contents .guide__box{margin-bottom:1.25rem;}
.guide__flip__contents .guide__box:last-child{margin-bottom:0;}
.guide__nav{width:100%; margin-bottom:2.5rem;}
.guide__nav__list{width:100%;}
.guide__nav__list li{width:20%; text-align:center; border:solid 0.0625rem #ccc; margin-left:-0.0625rem;}
.guide__nav__list li a{align-self:center; width:100%; padding:0.625rem;}
.guide__nav__list li.current{background:#4e83bb;}
.guide__nav__list li.current a{color:#fff;}
/* Guide(P1) */
.flowchart{width:100%; margin-top:1.25rem;}
.flowchart__wrap{width:100%;}
.flowchart__arrow{width:3.125rem; position:relative;}
.flowchart__arrow span{display:block; width:1.25rem; height:100%; margin:0 auto;}
.arrow--point{display:block; position:absolute; bottom:0; width:100%; height:1.5625rem; background-image:url("../img/arrow.svg"); background-repeat:no-repeat; background-size:100% auto;}
.arrow--blue{background-color:#4682b4;}
.arrow--orenge{background-color:#ffa500;}
.arrow--vio{background-color:#db7093;}
.arrow--red{background-color:#ff6347;}
.flowchart__inner.inner--clm{width:calc(100% - 3.125rem);}
.flowchart__item{padding:0.625rem; font-size:1.125rem; text-align:center;}
.flowchart__inner.inner--clm .flowchart__item{padding-right:3.125rem;}
.item--blue{background:#cce5ff;}
.item--pink{background:#ffd4ff;}
.flowchart__box{width:100%;}
.flowchart__box.arrow1 .flowchart__list{width:calc(100% - 3.125rem);}
.flowchart__box.arrow2 .flowchart__list{width:calc(100% - 6.25rem);}
.flowchart__box.arrow3 .flowchart__list{width:calc(100% - 9.375rem);}
.flowchart__list{padding:1.25rem 0.9375rem;}
/* Guide(P2) */
.tab--group{margin-bottom:0.9375rem;}
.tab--group tbody th{background:#f7f7f7; width:9.375rem;}
.tab--range tbody th{background:#f7f7f7; width:9.375rem;}
.tab--range tbody td{text-align:center;}
.tab--range .batu{font-size:1.375rem;}
/* Guide(P3) */
.tab--lottery thead th.tab--lottery--active{background:#ff6347; color:#fff;}
.tab--lottery tbody th{background:#f7f7f7; width:15.625rem;}
.tab--lottery tbody td{text-align:center;}
.lottery__example{width:100%; border-top:solid 0.0625rem #ccc; background:#f7f7f7; padding:1.25rem 0;}
.lottery__example__inner{width:100%; max-width:68.75rem; margin:0 auto;}
.lottery__example__box{width:50%; padding:1.25rem;}
.lottery__example__box:last-child{width:100%;}
/* Guide(P4) */
.payment{width:100%;}
.payment__step{width:100%; background:#f7f7f7; padding:0.625rem; margin-bottom:1.25rem; border-top:solid 0.0625rem #ccc;}
.payment__step li{width:26.66666666%; text-align:center; padding:0.625rem;}
.payment__step li.payment__between{width:10%;}
.payment__step__icon{display:block; width:100%; max-width:10rem; margin:0 auto 0.3125rem;}
.payment__step__point{display:block; width:100%; padding:0.625rem; text-align:center; font-weight:bold; background:#cce5ff; color:#4e83bb;}
.payment__step__arrow{width:100%;}
.payment__step__arrow:before{font-family:"FontAwesome"; content:"\f178"; font-size:5rem; color:#999;}
.payment__info em{background:#ffe5e5; padding:0.3125rem;}
.payment__info li{margin-bottom:0.3125rem; font-size:1.125rem;}
/* Guide(P5) */
.list--frame{background:#f7f7f7; padding:1.25rem; text-align:center; border:solid 0.0625rem #ccc;}
.list--frame li{font-size:1.25rem;}
/*=======
RWD Responsive
=====================*/
/*(MIN)---------------------------*/
@media (min-width:64.0625em){/*1025*/
	.guide__box a:hover{background:#fff; text-decoration:none;}
	.guide__nav__list li a:hover{background:#4e83bb; color:#fff;}
	}
/*(MAX)---------------------------*/
@media (max-width:64em){/*1024*/
	.guide__tab th,.guide__tab td{padding:0.625rem;}
	.guide__nav__list li{width:50%; margin-top:-0.0625rem;}
	.guide__nav__list li:last-child{width:100%;}
	.lottery__example{padding:0;}
	.payment__step__arrow:before{font-size:2.5rem;}
	}
@media (max-width:48em){/*768*/
	.guide__item{font-size:1.375rem;}
	.guide__subitem{font-size:1.125rem;}
	.guide__note,.guide__list{font-size:1rem;}
	.guide__tab th,.guide__tab td{font-size:1rem;}
	.guide__step{font-size:1rem;}
	.guide__step__item{font-size:1.125rem;}
	.tab--lottery tbody th{width:28%;}
	.payment__info li{font-size:1rem;}
	}
@media (max-width:40em){/*640*/
	.tab--spec th,.tab--spec td{display:block; margin-top:-0.0625rem;}
	.tab--service th,.tab--service td{display:block; margin-top:-0.0625rem;}
	.tab--service thead{display:none;}
	.tab--service tbody th{width:100%;}
	.guide__jump__wrap .page__jump{width:100%; margin-bottom:0.625rem; padding:0;}
	.guide__jump__wrap .page__jump:last-child{margin-bottom:0;}
	.guide__nav{margin-bottom:1.25rem;}
	.guide__flip .guide__nav{order:2; margin-bottom:2.5rem;}
	.guide__flip .guide__flip__contents{order:1; margin-bottom:1.25rem;}
	.tab--group tbody th{width:8.125rem;}
	.tab--range tbody th{width:8.125rem;}
	.tab--facility{width:40rem;}
	.tab--facility th,.tab--facility td{font-size:0.875rem; padding:0.3125rem;}
	.tab--group th,.tab--group td{font-size:0.875rem; padding:0.3125rem;}
	.tab--range th,.tab--range td{font-size:0.875rem; padding:0.3125rem;}
	.tab--lottery th,.tab--lottery td{font-size:0.875rem; padding:0.3125rem;}
	.tab--group tbody th{width:28%;}
	.tab--range tbody th{width:20%;}
	.tab--overflow{overflow-x:scroll;}
	.tab--overflow--help{display:block;}
	.guide__unique__disc{text-align:left;}
	.payment__step li{width:100%;}
	.payment__step li.payment__between{width:100%; padding:0;}
	.payment__step__arrow:before{content:"\f175";}
	.list--frame{text-align:left; padding:0.625rem;}
	.list--frame li{font-size:1rem;}
	.list--frame li strong{font-size:1.125rem;}
	}
@media (max-width:28.125em){/*450*/
	.press--wrap{padding:0 0.9375rem;}
	.guide__box{margin-bottom:1.25rem;}
	.guide__box__clm{padding:0.9375rem 0 0;}
	.guide__item{font-size:1.125rem;}
	.guide__subitem{font-size:1.125rem;}
	.guide__note,.guide__list{font-size:1rem;}
	.guide__jump__wrap{margin-bottom:1.875rem;}
	.guide__step__count{width:100%; text-align:left;}
	.guide__step__item{width:100%; -webkit-width:calc(100% - 0); width:calc(100% - 0);}
	.guide__step__field:after{margin-left:1.25rem;}
	.guide__unique__box{width:100%; padding:0.625rem;}
	.guide__unique__box:nth-of-type(2){border:0; border-top:solid 0.0625rem #ccc; border-bottom:solid 0.0625rem #ccc;}
	.flowchart__arrow{width:1.875rem;}
	.flowchart__arrow span{width:0.9375rem;}
	.arrow--point{height:0.9375rem;}
	.flowchart__inner.inner--clm{width:calc(100% - 1.875rem);}
	.flowchart__box.arrow1 .flowchart__list{width:calc(100% - 1.875rem);}
	.flowchart__box.arrow2 .flowchart__list{width:calc(100% - 3.75rem);}
	.flowchart__box.arrow3 .flowchart__list{width:calc(100% - 5.625rem);}
	.guide__nav__list li{width:100%; text-align:left; margin-left:0; position:relative;}
	.guide__nav__list li a:after{font-family:"FontAwesome"; content:"\f105"; position:absolute; right:0.625rem;}
	.flowchart__inner.inner--clm .flowchart__item{padding-right:1.875rem;}
	.lottery__example{border-top:0; background:#fff;}
	.lottery__example__box{padding:0.3125rem;}
	}
@media (max-width:23.75em){/*380*/
	.guide__step__item{font-size:1rem;}
	.payment__step__icon{max-width:7.5rem;}
	}