@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*/
.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__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__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: 1.2em;
}*/
.guide__list__sub{margin:0.625rem 0;}
.page__jump a{width:100%; border-width:0.125rem;}
.guide__tab{width:100%;}
.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:33.33333333%; padding:1.25rem; background:#f7f7f7;}
.guide__unique__box:nth-of-type(2){border-left:solid 0.0625rem #ccc; border-right: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:10%;}
.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--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:16.7477%; text-align:center; border:solid 0.0625rem #ccc; margin-left:-0.0625rem;line-height: 1.3;height:100%;min-height: 62px;}
.guide__nav__list li a{align-self:center; width:100%; padding:0.625rem;}
.guide__nav__list li.current{background:#4e83bb;}
.guide__nav__list li:hover{background:#4e83bb;}
.guide__nav__list li.current a{color:#fff;}
.guide__nav__list li:hover 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;}
.flowchart__list em{background:#fefbd7; padding:0.3125rem;}
/* 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;align-items: flex-start}
.payment__step2{width:100%; background:#fff; padding:0.625rem; margin-bottom:1.25rem; border-top:solid 0.0625rem #ccc;align-items: flex-start}
.payment__step3{width:100%; background:#fff; padding:0.625rem; margin-bottom:1.25rem; border-top:solid 0.0625rem #ccc;align-items: flex-start}
.payment__step li{width:18.88%; text-align:center; padding:0.625rem;}
.payment__step2 li{width:26%; text-align:center; padding:0.625rem;}
.payment__step3 li{width:13.33%; text-align:center; padding:0.625rem;}
.payment__step li.payment__between{width:8%;}
.payment__step2 li.payment__between{width:10%;}
.payment__step3 li.payment__between{width:8%;}
.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;}

.bg-pink{background-color: #ffdfd7;}
p.guide_note span.caption{font-size:0.9rem;}
h3.pay__btm{margin:1rem 0;font-size:1.2rem;}

li.ss{
    width: 40%;
    border: solid 1px #ccc;
}
.ss__step__arrow:before{font-family:"FontAwesome"; content:"\f061"; font-size:4rem; color:#999;padding:1rem;}
li.ss__between{padding:1rem;}

/*=======
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;}
	
	.lottery__example{padding:0;}
	.payment__step__arrow:before{font-size:1.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__step2 li{width:100%;}
	.payment__step2 li.payment__between{width:100%; padding:0;}
    .payment__step3 li{width:100%;}
	.payment__step3 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;}
	li.ss{width:100%;text-align:center;}
	li.ss__between{width:100%;text-align:center;}
	li.ss__between img{max-width:50px;}
	.ss__step__arrow:before{content:"\f063"; }
	}
@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;}
	}

    
    .sample_flex{display:flex;}
li.sample_img{flex-basis: 400px;margin:0 0 5rem 5rem;}
li.sample_img img{width: 400px;}
span.sample_txt{color:red;font-size: 90%;}
h5.guide__subitem.h5_koza{color:#444;}


@media (max-width:48em){
    
    .sample_flex{display:block;}
    li.sample_img{flex-basis: auto;margin:0 0 5rem 0rem;}
li.sample_img img{width:100%;}
}

.step2{position: relative;}
.step2::after{position: absolute;top:50%;}
.stp2-tbl{padding: 1rem 0;justify-content: space-between;font-weight: normal;text-align: center}
.stp2-tbl tbody th {text-align: center;}
.stp2-tbl li{width:48%;}
.stp2-tbl span{display: block;font-size: 0.75rem;}
.stp2-tbl td, th {padding: 0.5rem!important;}
.mention--red, .required--red, .required--blue{vertical-align:top}
.guide__flip h5.guide__subitem {
    font-size: 1.1rem;
    margin-bottom: 0.625rem;
    color: #666;
}
    .tab--lottery{display: block;
  overflow-x: scroll;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;}
.f7{background-color: #f7f7f7}


.tab--inq {
    white-space: nowrap;
}
.tab--inq tbody th {
    background: #e7f9ff;
    width: 15.625rem;
}
@media (max-width: 40em)
.tab--inq {
width: 40rem;

}


.touroku dl{}
.touroku dl dd{margin-left:1rem;}
.touroku dl dd dl{display: flex;flex-wrap: wrap}
.touroku dl dd dl dt{width: 10%;}
.touroku dl dd dl dd{width: 90%;margin-left: 0} 

.mention--blue{color:#008cff;}
.indt{font-size:1.125rem}
.indt dt{margin-left:1rem;}
.indt dd{margin-left:2rem;}
.list-dot{margin-left: 1.5rem;margin-bottom: 1.5rem}
.list-dot li{list-style-type: disc;margin-bottom: 0.5rem} 
.flex-chk{display: flex;flex-wrap: wrap;max-width:760px;margin: 1rem auto;}
.flex-chk li{width: 50%;text-align: left}

@media (max-width:48em){
    .flex-chk{display:block;}
    .flex-chk li{width: 100%;text-align: center}
}
.indentback{
  text-indent: -1em;
  padding-left: 1em;
}