@charset "utf-8";
/* Foundation
***********************************************************************/
*,
:before,
:after{
	box-sizing:border-box;
}
html,
body{
	min-width:320px;
	min-height:100%;
	-webkit-overflow-scrolling:touch;
	overflow-scrolling:touch;
	overflow-y:auto;
}
body,
input,
select,
textarea,
button{
	line-height:1.75;
	color:#333;
	font-size:16px;
	font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "Osaka", "MS Pゴシック", "MS PGothic", "MSゴシック", Arial, Helvetica, sans-serif;
	letter-spacing:.02em;
	word-wrap:break-word;
}
body{
	overflow-x:hidden;
	-webkit-text-size-adjust:100%;
	-webkit-font-smoothing:antialiased;
}
body.pc{
	overflow-y:visible;
}
img{
	vertical-align:bottom;
	width:auto\9;
	max-width:100%;
	height:auto;
	-ms-interpolation-mode:bicubic;
}
button{
	padding:0;
	background:transparent;
	border:none;
	cursor:pointer;
	outline:none;
	appearance:none;
}
a{
	color:#333;
	text-decoration:none;
}

/* input */
input[type="submit"],
input[type="button"],
input[type="search"],
input[type="file"],
select{
	-moz-appearance:none;
	-webkit-appearance:none;
}
input[type="text"],
input[type="password"],
input[type="tel"],
input[type="url"],
input[type="email"],
input[type="search"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="number"]{
	-moz-appearance:none;
	-webkit-appearance:none;
	max-width:100%;
	height:34px;
	padding:0 8px;
	background:#f2f3f3;
	border:1px solid #d3d4d4;
	border-radius:10px;
}
input[type="text"].is-error,
input[type="password"].is-error,
input[type="tel"].is-error,
input[type="url"].is-error,
input[type="email"].is-error,
input[type="search"].is-error,
input[type="datetime"].is-error,
input[type="datetime-local"].is-error,
input[type="date"].is-error,
input[type="month"].is-error,
input[type="week"].is-error,
input[type="time"].is-error,
input[type="number"].is-error{
	background:#ffebee;
	border-color:#f87f76;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="number"]:focus{
	border-color:#cc76cc;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}
input[type="number"] {
    -moz-appearance:textfield;
}

.textarea_wrap{
	display:inline-flex;
	width:100%;
}
textarea{
	-webkit-appearance:none;
	   -moz-appearance:none;
	vertical-align:top;
	width:100%;
	max-width:100%;
	height:120px;
	padding:0 8px;
	border:1px solid #d3d4d4;
	border-radius:10px 0 0 10px;
	overflow-y:scroll;
	resize:vertical;
}
.is-error textarea{
	background:#ffebee !important;
	border-color:#f87f76;
}
textarea:not(.textarea_readonly){
	background:#f2f3f3;
}
::-webkit-input-placeholder{
	color:#b0b0b1;
}
::-moz-placeholder{
	color:#b0b0b1;
	opacity:1;
}
:-ms-input-placeholder{
	color:#b0b0b1;
}

/* select */
select{
	height:34px;
	padding:0 40px 0 8px;
	background:#f2f3f3;
	border:1px solid #d3d4d4;
	border-radius:10px;
	white-space:nowrap;
}
.is-error select{
	background:#ffebee;
	border-color:#f87f76;
}
select::-ms-expand{
    display:none;
}
.select_wrap{
	display:inline-block;
	position:relative;
}
.select_wrap + .select_wrap{
	margin-left:4px;
}
.select_wrap:after{
	display:block;
	position:absolute;
	top:0;
	right:12px;
	bottom:4px;
	width:8px;
	height:8px;
	margin:auto;
	border-right:2px solid #333;
	border-bottom:2px solid #333;
    content:"";
	-webkit-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
			transform:rotate(45deg);
}

/* Layout
***********************************************************************/
#container{
	max-width:1020px;
	margin:0 auto;
}

/* Object
***********************************************************************/
.flex{
	display:flex;
	margin:0 -4px;
}
.flex-wrap{
	flex-wrap:wrap;
}
.flex_item{
	margin:0 4px;
}
.label_gray{
	color:#7e7c7c;
}
.label_darkgray-bold{
	color:#555;
	font-weight:bold;
}
.btn_area{
	margin:50px auto 0;
	text-align:center;
}
.btn{
	display:inline-block;
	position:relative;
	line-height:1;
	background:transparent;
	border-radius:10px;
	font-weight:bold;
	cursor:pointer;
	transition:all .2s;
}
.btn-ghost{
	padding:16px 30px 14px;
	border:2px solid #cc76cc;
}
.btn-option{
	vertical-align:top;
	padding:10px 40px 8px;
	background:#333;
	border:0;
	color:#fff;
}

.radio,
.checkbox{
	display:inline-block;
	vertical-align:middle;
	position:relative;
	margin-right:16px;
	margin-bottom:8px;
	cursor:pointer;
}
.radio_input,
.checkbox_input,
.radio_btn,
.checkbox_btn{
	display:inline-block;
	position:absolute;
	top:-1px;
	width:30px;
	height:30px;
	margin:0;
}
.radio_input,
.checkbox_input{
	opacity:0;
}
.radio_btn,
.checkbox_btn{
	background:#f2f3f3;
	border:1px solid #cc76cc;
}
.is-error .radio_btn,
.is-error .checkbox_btn{
	background:#ffebee;
	border-color:#cc76cc;
}
.radio_btn{
    border-radius:50%;
}
.checkbox_btn{
    border-radius:10px;
}
.checkbox-only .checkbox_btn,
.radio-only .radio_btn{
	vertical-align:top;
	position:relative;
}
.radio_input:checked + .radio_btn,
.checkbox_input:checked + .checkbox_btn{
	border-color:#cc76cc;
}
.radio_btn:after,
.checkbox_btn:before,
.checkbox_btn:after{
    content:"";
    display:inline-block;
    position:absolute;
    top:0;
	right:0;
	bottom:0;
    left:0;
	margin:auto;
	background:#cc76cc;
}
.radio_btn:after{
    width:18px;
    height:18px;
	border-radius:50%;
	transform:scale(0);
	transition:transform .1s;
}
.radio_input:checked + .radio_btn:after{
	transform:scale(1);
}
.checkbox_btn:before,
.checkbox_btn:after{
	border-radius:3px;
	opacity:0;
	transition:transform .2s, top .2s, right .2s, bottom .2s, left .2s;
}
.checkbox_btn:before{
	bottom:-16px;
	left:-3px;
    width:12px;
    height:3px;
}
.checkbox_btn:after{
	right:-6px;
    width:3px;
    height:20px;
}
.checkbox_input:checked + .checkbox_btn:before,
.checkbox_input:checked + .checkbox_btn:after{
	opacity:1;
	-webkit-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
			transform:rotate(45deg);
}
.checkbox_input:checked + .checkbox_btn:before{
	bottom:-5px;
	left:-13px;
}
.checkbox_input:checked + .checkbox_btn:after{
	right:-6px;
}
.radio_txt,
.checkbox_txt{
	display:inline-block;
	padding-left:38px;
}

.dl > dl + dl{
	margin-top:8px;
}
.dl_line{
	margin:-8px 0;
}
.dl_line > dl{
	padding:4px 0;
}
.dl_line dl + dl{
	border-top:1px solid #d3d4d4;
	margin-top:0;
}
.dl_line > dl > dt{
	padding:4px 0;
}

.dlCol{
	max-width:640px;
	margin:0 auto;
}
.dlCol > dl + dl{
	margin-top:32px;
}
.dlCol > dl > dt{
	font-weight:bold;
}
.dlCol > dl > dd{
	margin-top:8px;
}

.dlTable_ttl{
	width:100%;
	max-width:680px;
	margin:0 auto 12px;
	padding:2px 8px;
	background:#cc76cc;
	color:#fff;
	font-weight:bold;
}
.dlTable_ttl:not(:first-child){
	margin-top:48px;
}
.dlTable{
	display:table;
}
.dlTable > dl{
	position:relative;
	display:table-row;
}
.dlTable > dl > dt,
.dlTable > dl > dd{
	display:table-cell;
	vertical-align:top;
}
.dlTable > dl > dt{
	white-space:nowrap;
}
.dlTable > dl > dd{
	padding-left:16px;
}
.dlTable_btn_area{
	width:100%;
	max-width:636px;
	margin:0 auto;
}

.dlTable-line{
	width:100%;
	max-width:800px;
	margin:0 auto;
	border-top:1px solid #e6e7e9;
	border-bottom:1px solid #e6e7e9;
}
.dlTable-line > dl + dl > dt{
	border-top:1px solid #e6e7e9;
}
.dlTable-line > dl > dt{
	padding:16px 8px 0;
	font-weight:bold;
}
.dlTable-line > dl > dd{
	padding:4px 8px 16px;
}
.dlTable-line input[type="text"],
.dlTable-line .select_wrap,
.dlTable-line .textarea_wrap{
	margin-bottom:8px;
}
.dlTable-line input[type="text"]{
	width:100%;
}

.table-line{
	width:100%;
	max-width:640px;
	margin:0 auto;
	border-top:1px solid #d3d4d4;
	border-bottom:1px solid #d3d4d4;
}
.table-line thead th{
	padding:8px 8px 4px;
}
.table-line tbody th,
.table-line tbody td{
	vertical-align:top;
	padding:8px 8px 4px;
	border-top:1px solid #d3d4d4;
}

.iconLabel{
	display:inline-block;
	vertical-align:top;
	position:relative;
	top:2px;
	padding:0 4px;
	border-radius:2px;
	color:#fff;
	font-size:12px;
	font-weight:normal;
}
.iL-required{
	background:#f44336;
}
.iL-option{
	background:#9e9e9e;
}

.link-txt{
	color:#cc76cc;
	text-decoration:underline;
}

.stepper{
	display:flex;
	counter-reset:number;
	width:100%;
	margin:0 auto 30px;
	font-weight:bold;
	font-size:15px;
}
.stepper li{
	display:flex;
	flex:1;
	align-items:center;
    justify-content:center;
	position:relative;
	padding:12px;
	color:#999;
	background:#f2f2f2;
}
.stepper li:first-child{
	border-radius:5px 0 0 5px;
}
.stepper li:last-child{
	border-radius:0 5px 5px 0;
}
.stepper_num:before{
	counter-increment:number;
	content:counter(number);
    z-index:2;
}
.stepper li.is-active{
	color:#cc76cc;
}
.stepper li .stepper_txt{
	display:none;
}
.stepper li:not(:last-child):after{
	content:"";
	position:absolute;
	top:0;
	right:-2px;
	bottom:0;
	z-index:1;
	height:8px;
	width:8px;
	margin:auto;
	border-top:2px solid #ccc;
	border-right:2px solid #ccc;
	-webkit-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
			transform:rotate(45deg);
}

/* attention */
.attention{
	position:relative;
	padding:8px 12px 8px 40px;
	border-radius:8px;
}
.attention_ttl{
	font-weight:bold;
}
.attention:before,
.attention:after{
	position:absolute;
	line-height:1;
}
.attention:after{
	width:24px;
	text-align:center;
}
.attention-info{
	background:#d6e8f4;
	border:1px solid #a1cbe6;
	color:#426782;
}
.attention-info:before{
	content:"";
	display:inline-block;
	top:8px;
	left:8px;
	width:24px;
	height:24px;
	background:#4d7999;
	border-radius:50%;
}
.attention-info:after{
	content:"i";
	top:13px;
	left:8px;
	color:#c9e1f1;
	font-weight:bold;
}
.attention-info .marker-disc:before{
	background:#4d7999;
}
.attention-info .marker-accent:before{
	background:#4d7999;
	box-shadow:0 0 0 1px #4d7999 inset, 0 0 0 2px #fff inset;
}
.attention-error{
	background:#f1c5c8;
	border:1px solid #e6a1a6;
	color:#cd434d;
}
.attention-error:before{
	content:"";
	display:inline-block;
	top:9px;
	left:8px;
	width:24px;
	height:24px;
	background:#cd434d;
	border-radius:50%;
}
.attention-error:after{
	content:"！";
	top:14px;
	left:8px;
	color:#f1c5c8;
	font-weight:bold;
}
.notes{
	display:block;
	padding-left:19px;
	text-indent:-19px;
}

/* header
----------------------------------------------------------------------*/
header{
	display:flex;
	justify-content:center;
	margin-bottom:16px;
	padding:24px 16px;
	border-top:9px solid #cc76cc;
}
.page_ttl{
	line-height:1.5;
	color:#cc76cc;
	font-weight:bold;
	font-size:26px;
}
.page_ttl_sub{
	font-size:20px;
}
.page_ttl_main{
	display:block;
	margin-top:8px;
	padding-top:2px;
	background:#cc76cc;
	border-radius:18px;
	color:#fff;
	text-align:center;
}

/* contents
----------------------------------------------------------------------*/
#contents{
	max-width:992px;
	margin:0 auto;
	padding:0 16px 80px;
}

/* main
----------------------------------------------------------------------*/
#main{
	display:flex;
	flex-direction:column;
	align-items:center;
}
#main > * {
	min-width:288px;
    max-width:100%;
    min-height:0%;
	flex-shrink:0;
}
.sec{
	width:100%;
}
.sec_ttl{
	margin-bottom:16px;
	font-weight:bold;
	font-size:20px;
}

.subsec:not(:first-child){
	margin-top:40px;
}
.subsec_ttl{
	font-weight:bold;
}
.sec_body{
	display:flex;
	flex-direction:column;
	align-items:center;
}
.sec_body > * {
    min-height:0%;
	flex-shrink:0;
}
.txt_area{
	width:100%;
}

/* btnTop
----------------------------------------------------------------------*/
#btnTop{
	position:fixed;
	right:8px;
	bottom:8px;
	z-index:9999;
	opacity:0;
	transition:opacity .4s;
}
#btnTop.is-active{
	opacity:1;
}
#btnTop a{
	display:block;
	position:relative;
	width:56px;
	height:56px;
	background:rgba(0,0,0,.5);
	border-radius:50%;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
}
#btnTop a:after{
    display:block;
    position:absolute;
    top:8px;
    right:0;
	bottom:0;
	left:0;
    width:18px;
    height:18px;
	margin:auto;
    border-top:solid 2px #fff;
    border-left:solid 2px #fff;
	-webkit-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
			transform:rotate(45deg);
    content:"";
}

/* Utility
***********************************************************************/
.u-width-218{
	max-width:218px !important;
}
.u-width-70{
	max-width:70px !important;
}
.u-h60{
	height:60px;
}
.u-mt-8{
	margin-top:8px !important;
}
.u-mt-12{
	margin-top:12px;
}
.u-mt-24{
	margin-top:24px;
}
.u-mr-8{
	margin-right:8px;
}
.u-mr-16{
	margin-right:16px;
}
.u-mr-24{
	margin-right:24px;
}
.u-mb-8{
	margin-bottom:8px;
}
.u-mb-12{
	margin-bottom:12px;
}
.u-mb-16{
	margin-bottom:16px;
}
.u-ml-8{
	margin-left:8px;
}
.u-ta-c{
	text-align:center;
}
.u-ta-r{
	text-align:right;
}
.u-fw-b{
	font-weight:bold;
}
.u-fs-l{
	font-size:20px;
}
.u-fs-m{
	font-size:14px;
}
.u-col-red{
	color:#f44336;
}
.u-disp-iB{
	display:inline-block
}

/*=====================================================================
   PC start
======================================================================*/
@media print, screen and (min-width:768px){
/* Foundation
***********************************************************************/
html,
body{
	overflow-y:visible;
}

.pc a.is-hover{
	text-decoration:none;
}

/* Object
***********************************************************************/
.pc .btn-ghost.is-hover,
.pc .btn-cart a.is-hover{
	background:#cc76cc;
	color:#fff;
}
.pc .btn-option.is-hover{
	opacity:.6;
}
.btn-cart .btn.is-hover:before{
	background:url("../images/img_cart_w.png") center / cover no-repeat;
}
.dlTable-pc{
	display:table;
}
.dlTable-pc > dl{
	position:relative;
	display:table-row;
}
.dlTable-pc > dl > dt,
.dlTable-pc > dl > dd{
	display:table-cell;
	vertical-align:top;
}
.dlTable-pc > dl > dt{
	white-space:nowrap;
	width:148px;
}
.dlTable-pc > dl > dd > input:not(.btn-option),
.dlTable-pc > dl > dd > .select_wrap,
.dlTable-pc > dl > dd > .textarea_wrap{
	margin-top:-6px;
}
.dlTable-pc > dl > dd > .btn-option{
	margin-top:-3px;
}
.dlTable-pc > dl > dd > .radio,
.dlTable-pc > dl > dd > .checkbox{
	margin-top:-2px;
}
.dlTable-line > dl + dl > dd{
	border-top:1px solid #e6e7e9;
}
.dlTable-line > dl > dt,
.dlTable-line > dl > dd{
	padding-top:16px;
	padding-bottom:16px;
}
.dlTable-pc.dlTable-line > dl > dd{
	padding-left:32px;
}
.dlTable-line input[type="text"],
.dlTable-line .select_wrap,
.dlTable-line .textarea_wrap{
	margin-bottom:0;
}

.stepper li{
	flex:auto;
	padding:12px 0;
}
.stepper li:first-child{
	padding-left:16px;
}
.stepper li:not(:first-child){
	padding-left:30px;
}
.stepper li:not(:last-child){
	border-right:4px solid #fff;
}
.stepper li:last-child{
	padding-right:16px;
}
.stepper_num:before{
	//content:"";
}
.stepper li.is-active{
	color:#fff;
	background:#cc76cc;
}
.stepper li .stepper_txt{
	display:inline;
	padding-left: 8px;
}
.stepper li:not(:last-child):before{
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	z-index:1;
	margin:auto;
}
.stepper li:not(:last-child):before,
.stepper li:not(:last-child):after{
	height:0;
	width:0;
	margin:auto;
	border:26px solid transparent;
	border-right-width:0;
	-webkit-transform:rotate(0);
		-ms-transform:rotate(0);
			transform:rotate(0);
}
.stepper li:not(:last-child):before{
	right:-54px;
	border:25px solid transparent;
	border-left-color:#fff;
}
.stepper li:not(:last-child):after{
	right:-50px;
	border:25px solid transparent;
	border-left-color:#f2f2f2;
}
.stepper li.is-active:not(:last-child):after{
	border-left-color:#cc76cc;
}

/* header
----------------------------------------------------------------------*/
.page_ttl{
	font-size:36px;
	text-align:center;
}
.page_ttl_sub{
	font-size:30px;
}
.page_ttl_main{
	padding-top:4px;
	border-radius:32px;
}

/* main
----------------------------------------------------------------------*/
.sec_ttl{
	font-size:26px;
}

/* btnTop
----------------------------------------------------------------------*/
#btnTop{
	right:20px;
}
#btnTop .is-hover{
	transition:opacity .2s;
	opacity:.6;
}

/*=====================================================================
   PC end
======================================================================*/
}