@charset "utf-8";

/* ---------------------------------------------
CSS Info

 File name:  common.css
 Style Info: 共通要素

------------------------------------------------ */
.container {
	position: relative;
	width: 94%;
	max-width: 1200px;
	margin: 0 auto;
}
.container.small {
	width: 94%;
	max-width: 980px;
}

@media screen and (max-width:767px) {
	.pc-only {display: none;}
}
@media screen and (min-width:768px) {
	.sp-only {display: none;}
}


/* HEADER
------------------------------------------------ */
.l-header {background: #FFF;}
.l-header .header-inr {
	padding: 8px 0;
}
.header-logo img {
	width: auto;
	height: 24px;
	vertical-align: bottom;
}
.header-txt {
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: 700;
}

@media screen and (max-width:767px) {
	.l-header .header-inr {text-align: center;}
	.header-txt {margin-top: .5em;}
	
}
@media screen and (min-width:768px) {
	.l-header .header-inr {
		display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
		-webkit-justify-content: space-between;
		-ms-justify-content: space-between;
		justify-content: space-between;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}
	.header-logo img {height: 32px;}
	.header-txt {
		font-size: 15px;
		font-size: 1.5rem;
	}
	
}


/* メインコンテンツ
------------------------------------------------ */
.l-main {
	display:block; /* IE対策 */
	overflow: hidden;
}

.nav-tabs,
.location {
	position: relative;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
}
.nav-tabs:before {
	position: absolute;
	content: "";
	width: 100%;
	height: 4px;
	top: calc(50% - 2px);
	border-radius: 2px;
	z-index: 1;
}
.nav-tabs li {
	position: relative;
	z-index: 2;
	width: 24px;
	height: 24px;
	line-height: 23px;
	border-radius: 100%;
	margin-right: 8px;
	font-size: 14px;
	font-size: 1.4rem;
	text-align: center;
}
.nav-tabs li.active {
	width: auto;
	padding: 0 1.25em;
	font-weight: 700;
}
.nav-tabs .nav-item .label {display: none;}
.nav-tabs li.active .label {
	display: inline-block;
	margin-left: 4px;
}
.location {
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.location .loc-item {
	width: 24px;
	height: 24px;
	line-height: 23px;
	border-radius: 100%;
	margin-right: 4px;
	font-size: 14px;
	font-size: 1.4rem;
	text-align: center;
}
.location .loc-item.active {font-weight: 700;}

.wizard-box{padding: 32px 0;}
.wizard-box .ttl {
	margin-bottom: 1.5em;
	font-weight: 700;
}

dl.item-flt:not(:last-of-type) {margin-bottom: 16px;}
dl.item-flt dt span {
	display: inline-block;
	margin-left: 8px;
	padding: .25em .5em;
	border-radius: 2px;
	font-size: 11px;
	font-size: 1.1rem;
	line-height: 1;
}
dl.item-flt dt span.any {background: #CCC;}
dl.item-flt dt span.must {
	background: #F7224D;
	color: #FFF;
}

.btn-group {
	margin-top: 40px;
	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
}
.btn-group button {
	outline: none;
	border: none;
	overflow: hidden;
	padding: 1em 1.5em;
	line-height: 1.5;
	cursor: pointer;
}
.btn-group .btn-prev {
	margin-right: 16px;
	font-size: 14px;
	font-size: 1.4rem;
}
.btn-group .btn-next,
.btn-group .btn-submit {
	width: 200px; 
	padding: 1em;
	font-weight: 700;
	text-align: center;
}
.btn-group .btn-submit span {
	font-size: 12px;
	font-size: 1.2rem;
}
.btn-group .btn-next:disabled,
.btn-group .btn-submit:disabled {
	cursor: not-allowed;
}

@media screen and (max-width:767px) {
	.l-main-inr {padding: 16px 0 24px;}
	.nav-tabs li.active {border-radius: 12px;}
	
	dl.item-flt dt {margin-bottom: 8px;}
}
@media screen and (min-width:768px) {
	.l-main-inr {padding: 40px 0 120px;}
	.wizard-wrap {padding: 24px;}
	
	.nav-tabs li {
		width: 28px;
		height: 28px;
		line-height: 28px;
		margin-right: 16px;
	}
	.nav-tabs li.active {border-radius: 14px;}
	
	.wizard-box{padding: 48px 0;}
	
	dl.item-flt {
		display:-webkit-box;
		display:-ms-flexbox;
		display:flex;
	}
	dl.item-flt dt {
		width: 10em;
		text-align: right;
	}
	dl.item-flt dd {
		flex: 1;
		padding-left: 1em;
		text-align: left;
	}
	
	.btn-group {margin-top: 80px;}
	.btn-group .btn-next,
	.btn-group .btn-submit {
		width: 320px;
		font-size: 18px;
		font-size: 1.8rem;
	}
	.btn-group .btn-submit span {
		font-size: 14px;
		font-size: 1.4rem;
	}
	
}


/* 汎用
------------------------------------------------ */
/*----- ボタン -----*/
.cm-btn a {
	position: relative;
	display: inline-block;
	width: 100%;
	max-width: 320px;
	height: 48px;
	line-height: 45px;
	padding: 0 1em;
	background: #FFF;
	border: 2px solid #010101;
	border-radius: 28px;
	font-size: 22px;
	font-size: 2.2rem;
	font-weight: 700;
	color: #010101;
	text-align: center;
}
.cm-btn a:hover {
	background: #CC1445;
	border: 2px solid #CC1445;
	color: #FFF;
}
.cm-btn a i {margin-left: 8px;}

@media screen and (min-width:768px) {
	.cm-btn a {
		font-size: 22px;
		font-size: 2.2rem;
	}
}


/*----- リスト -----*/
.list-dot li {
	position: relative;
	margin: 0 0 0 1em;
}
.list-dot li:not(:last-child) {margin-bottom: .5em;}
.list-dot li:before {
	display: inline-block;
	content: "";
	position: absolute;
	top: .65em;
	left: -1em;
	width: .5em;
	height: .5em;
	border-radius: 50%;
	background: #999;
}
.list-dot.blue li:before,
.list-dot li.blue:before {background: #009bdd;}
.list-dot.pink li:before,
.list-dot li.pink:before {background: #f25c5c;}
.list-dot.orange li:before,
.list-dot li.orange:before  {background: #f29a2e;}

/*----- 数字リスト -----*/
ol.list-num {
	counter-reset:number;
	list-style:none;
	margin:0;
	padding:0;
}
ol.list-num li:before{
	counter-increment: number;
	content: counter(number); 
	background: #66c0e8;
	display: inline-block;
	width: 1.5em;
	height: 1.5em;
	line-height: 1.5em;
	text-align: center;
	border-radius: 50%;
	color: #fff;
	margin-right: .3em;
	font-size: 90%;
}

/*----- 背景関連 -----*/
.bg-yel {background-color: #ffee00;}
.bg-wh {background-color: #FFF;}
.bg-ptn {background: #f1ff42 url("../img/common/bg-ptn_cm.png");}
.bg-ptn2 {background: #f1ff42 url("../img/common/bg-ptn2_cm.png");}
.bg-chk {background: #ffee00 url("../img/common/bg-check_cm.png");}

/*----- 文字関連 -----*/
.txt-center {text-align: center;}
.txt-right {text-align: right;}
.txt-bold {font-weight: bold;}
.txt-nml {font-weight: normal;}
.txt-big {
	font-size: 18px !important;
	font-size: 1.8rem !important;
}
.txt-small {
	font-size: 12px !important;
	font-size: 1.2rem !important;
}

.txt-red {color: #f03434;}
.txt-pink {color: #F7224D;}
.txt-ppl {color: #4f00ff;}
.txt-org {color: #f29a2e;}
.txt-yel {color: #fff45c;}
.txt-gry {color: #757575;}
.txt-grn {color: #4CAF50;}

.marker-yel {
	background: #fff45c;
	background: -webkit-linear-gradient(transparent 70%, #fff45c 0%);
	background: linear-gradient(transparent 70%, #fff45c 0%);
}
@media screen and (min-width:960px) {
	.txt-center_pc {text-align: center;}
	.txt-big {
		font-size: 24px !important;
		font-size: 2.4rem !important;
	}
}


/*----- MARGIN -----*/
.mt8{margin-top:8px;}
.mb8{margin-bottom:8px;}
.mt16{margin-top:16px;}
.mb16{margin-bottom:16px;}
.mt24{margin-top:24px;}
.mb24{margin-bottom:24px;}
.mt32{margin-top:32px;}
.mb32{margin-bottom:32px;}
.mt40{margin-top:40px;}
.mb40{margin-bottom:40px;}
.mt48{margin-top:48px;}
.mb48{margin-bottom:48px;}
.mt56{margin-top:56px;}
.mb56{margin-bottom:56px;}
.mt64{margin-top:64px;}
.mb64{margin-bottom:64px;}