@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;500;700&display=swap');

@charset "UTF-8";

html{ font-size: 62.5%;}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q,
samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	font-weight: 300;
	box-sizing: border-box;
	-webkit-appearance: none;
}

body {
	display: block;
	background-color: #fff;
	color: #333;
	text-align: left;
	font-size: 1.4rem;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
	line-height: 1;
	-webkit-text-size-adjust: 100%;
	cursor: auto;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}

ul, ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

a {
	color: #00aeef;
	text-decoration: none;
	cursor: pointer;
}

a,
area,
button,
[role="button"],
input:not([type=range]),
label,
select,
summary,
textarea {
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
}

a:visited { color: #0073c4;}
a:hover { color: #0073c4;}
a:focus,
a:active { color: #0073c4;}

em,address { font-style: normal;}

hr { display: none;}

img {
	max-width: 100%;
	width: 100%;
	height: auto;
	border: none;
	background: transparent;
	vertical-align: bottom;
}

select option { padding: 0;}
label { cursor: pointer;}
strong{ font-weight: bold;}

*:focus { outline: none;}

input,
select{
	position: relative;
	padding: 0.5em 0.4em;
	width: 100%;
	display: block;
	outline: none;
	border: 1px solid #ccc;
	border-radius: 0.2em;
	box-sizing: border-box;
	font-size: 1.6rem;
}

select{
	cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: #fff;
	position: relative;
}

select::-ms-expand { display: none;}



select:after {
	position: absolute;
	top: 50%;
	right: 10px;
	margin-top: -4px;
	width: 6px;
	height: 6px;
	display: block;
	border-bottom: solid 2px #b4b3b3;
	border-right: solid 2px #b4b3b3;
	transform: rotate(45deg);
	content: "";
	pointer-events: none;
	z-index: 100;
}

.radio{ display: none;}

.radio + label{
	position:relative;
	margin: 0 2em 0 0;
	padding: 0 0 0 1.5em;
	font-size: 1.6rem;
}

.radio + label:before{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	width: 14px;
	height: 14px;
	display: block;
	border: 1px solid #999;
	border-radius: 50%;
	content: "";
}

.radio:checked + label{
	color: #207fdc;
	font-weight: bold;
}

.radio:checked + label:after{
	position: absolute;
	top: 0;
	left: 3px;
	bottom: 0;
	margin: auto;
	width: 10px;
	height: 10px;
	display: block;
	background: #207fdc;
	border-radius: 50%;
	content: "";
}


.checkbox {display: none;}

.checkbox + label{
	position:relative;
	margin: 0 2em 0 0;
	padding: 0 0 0 1.5em;
	font-size: 1.6rem;
	line-height: 1.4;
}

.checkbox + label:before{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	width: 14px;
	height: 14px;
	display: block;
	border: 1px solid #999;
	border-radius: 0.2em;
	content: "";
}

.checkbox:checked + label{
	color: #207fdc;
	font-weight: bold;
}

.checkbox:checked + label:after{
	position: absolute;
	top:-4px;
	left:3px;
	bottom: 0;
	margin: auto;
	width: 8px;
	height: 8px;
	display: block;
	content: "";
	transform: rotate(40deg);
	border-bottom: 2px solid #207fdc;
	border-right: 2px solid #207fdc;
}


.notice-list li{
	position: relative;
	margin: 0 0 0.5em 1.5em;
	padding: 0;
	list-style: none;
	font-size: 1.6rem;
	line-height: 1.6;
	text-align: left;
}

.notice-list li:before{
	position: absolute;
	top: 0;
	left: -1.5em;
	padding: 0;
	color: #f30;
	font-size: 1.6rem;
	line-height: 1.4;
	content: "※";
}


.clear{ clear: both;}

.clearfix:after,
.wrap:after{
	content: "";
	display: block;
	clear: both;
}

.wrap{
	position: relative;
	padding: 0;
	display: block;
	overflow: hidden;
	width: 100%;
}

.sp-block{ display: block;}
.pc-block{ display: none;}
.sp-none{ display: block;}
.pc-only{ display: none;}
.sp-only{ display: none;}



/* HEADER */

header{
	position: relative;
	width: 100%;
	display: block;
	height: 120px;
	z-index: auto;
}

header:before{
	position: absolute;
	top: 0;
	width: 100%;
	height: 80px;
	display: block;
	background: rgb(238,238,238);
	background: linear-gradient(0deg, rgba(238,238,238,0.75) 0%, rgba(255,255,255,1) 30%);
	content: "";
	z-index: -1;
}

header:after{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 40px;
	display: block;
	border-top: 1px solid #fff;
	background-color: #00aeef;
	content: "";
	z-index: -1;
}

header .inner{
	position: relative;
	margin: auto;
	padding: 0 3%;
	width: 100%;
	max-width: 1080px;
	height: 120px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}

header .logo{ width: 180px;}

header .menu{
	margin: 0;
	width: calc(100% - 200px);
	height: 80px;
	display: flex;
	align-content: center;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
}

header .waiting{
	margin: 0;
	padding: 0 1em 0.3em 1em;
	display: block;
	border-bottom: 1px solid #999;
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
}

header .waiting strong{
	padding: 0 0.5rem;
	color: #008eca;
	font-size: 2.2rem;
	font-weight: 600;
	line-height: 0.6;
}

header .trigger {
	position: absolute;
	bottom: 0;
	right: 10px;
	padding: 4px 2px;
	width: 40px;
	height: 40px;
	display: block;
	border: none;
	cursor: pointer;
	outline: none;
	z-index: 100;
}

header .trigger:before,
header .trigger:after,
header .trigger em{
	display: block;
	width: 32px;
	height: 3px;
	margin: 6px 2px;
	border-radius: 0.2em;
	background: #fff;
	transition: all 0.2s;
	transform-origin: 0 0;
	content:"";
}

header .trigger em{
	overflow: hidden;
	line-height: 300;
}

header .trigger.active:before {
	background-color: #fff;
	transform: translateY(-3px) translateX(5px) rotate(45deg);
}
header .trigger.active em { opacity: 0;}
header .trigger.active:after {
	background-color: #fff;
	transform: translateY(2px) translateX(3px) rotate(-45deg);
}


header .header-menu{
	position: absolute;
	left: 0;
	top: 120px;
	margin: auto;
	width: 100%;
	z-index: 500;
}

header .mypage-menu{
	margin: 0;
	padding: 1em;
	width: 100%;
	display: block;
	background-color: #eee;
	border-bottom: 1px dotted #999;
}

header .mypage-menu a{
	position: relative;
	margin: 0 0 0.5em 0;
	padding: 0.5em 0 0.5em 1.4em;
	display: block;
	color: #333;
	font-size: 1.5rem;
	font-weight: 300;
	line-height: 1.4;
}

header .mypage-menu a:before{
	position: absolute;
	left: 0.5em;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 1.2rem;
	height: 1.2rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow.svg) center center no-repeat;
	background-size: contain;
	content: "";
}

header .contents-menu{
	margin: 0;
	padding: 1em 0 1em;
	width: 100%;
	display: block;
	background-color: #eee;
}

header .contents-menu li{ margin: 0 0 0 1.4rem;}

header .contents-menu li a{
	position: relative;
	margin: 0 0 0.5em 0;
	padding: 0.5em 0 0.5em 1.8em;
	display: block;
	color: #333;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.4;
	z-index: 150;
}

header .contents-menu li a:before{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	width: 2.5rem;
	height: 2.5rem;
	display: block;
	content: "";
}

header .contents-menu li:nth-child(1) a:before{ background: url(/media/recipient/img/icon_talk.svg) center center no-repeat; background-size: contain;}
header .contents-menu li:nth-child(2) a:before{ background: url(/media/recipient/img/icon_talk.svg) center center no-repeat; background-size: contain;}
header .contents-menu li:nth-child(3) a:before{ background: url(/media/recipient/img/icon_q.svg) center center no-repeat; background-size: contain;}
header .contents-menu li:last-child a:before{ width: 2.2rem; height: 2.2rem; background: url(/media/recipient/img/icon_l.svg) center center no-repeat; background-size: contain;}


header .contents-menu .new-data a:after{
	position: absolute;
	top: -0.2rem;
	left: 1.5rem;
	margin: auto;
	width: 1.5rem;
	height: 1.5rem;
	display: block;
	background: url(/media/recipient/img/icon_caution.svg) center center no-repeat;
	background-size: contain;
	animation: new 3s ease-in-out infinite;
	content: "";
}


@keyframes new {
	0% { transform: scale(1);}
	50% { transform: scale(1.3);}
	100% { transform: scale(1);}
}


header .user-name{
	position: relative;
	margin: 0;
	width: 100%;
	display: flex;
	align-items: center;
	height: 40px;
	color: #fff;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 0.05em;
}


.login header .inner{
	position: relative;
	margin: auto;
	padding: 0.6rem 3%;
	width: 100%;
	max-width: 1080px;
	height: 120px;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
}
.login header .waiting{ display: none;}
.login header .trigger { display: none;}

.login header .user-name{ display: none;}


/* FOOTER */

footer{
	padding: 2em 0;
	width: 100%;
	display: block;
	background-color: #00aeef;
}

footer a,
footer a:hover{ color: #fff;}

footer a:visited,
footer a:focus,
footer a:active { color: #fff;}


footer .foot-body{
	margin: auto;
	width: 96%;
	display: block;
	color: #fff;
	font-size: 1.4rem;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
}

footer .foot-menu{
	padding: 0 0 1em 0;
	width: 100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

footer .foot-menu li{
	padding: 0.4em 0.8em;
	border-right: 1px dotted #fff;
}

footer .foot-menu li:last-child{ border-right: none;}


footer .foot-foot{
	padding: 0;
	width: 100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

footer .foot-foot .copyright,
footer .foot-foot span{
	padding: 0.2em 0.5em;
	font-size: 1.3rem;
	line-height: 1.4;
	text-align: center;
}

footer .copyright{ display: block; font-size: 1.4rem;}


/* FOOT PRINT */

.foot-print{
	position: relative;
	clear: both;
	margin: 0 auto 0;
	padding: 1em 0;
	width: 100%;
	z-index: 1;
}

.foot-print ul{
	position: relative;
	margin: auto;
	padding: 1em 0;
	width: 100%;
	max-width: 1080px;
	border-top: 1px dotted #999;
	display: flex;
	z-index: 1;
}

.foot-print:before,
.foot-print:after {
	position: absolute;
	top: 2px;
	z-index: 2;
	width: 15px;
	height: 4em;
	content: "";
}

.foot-print:before { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0), #fff);}
.foot-print:after { left: 0; background: linear-gradient(to left, rgba(255, 255, 255, 0), #fff);}

.foot-print ul {
	overflow-x: scroll;
	-ms-overflow-style: none;    /* IE, Edge */
	scrollbar-width: none;       /* Firefox */
}

.foot-print ul::-webkit-scrollbar {  /* Chrome, Safari */
	display:none;
}

.foot-print ul li {
	position: relative;
	margin: 0 8px;
	font-size: 1.4rem;
	line-height: 1.4;
	white-space: nowrap;
}

.foot-print ul li:after{
	position: absolute;
	top: 50%;
	right: -0.8em;
	margin-top: -4px;
	width: 6px;
	height: 6px;
	border: 0px;
	border-top: solid 1px #999;
	border-right: solid 1px #999;
	transform: rotate(45deg);
	content: "";
	pointer-events: none;
}

.foot-print ul li:last-child:after{ border: none;}


/* CONTENTS */

.contents-intro{
	position: relative;
	margin: auto;
	padding: 0;
	width: 100%;
	display: block;
	overflow: hidden;
	z-index: auto;
}

.contents-intro:before{
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	display: block;
	background: rgb(238,238,238);
	background: linear-gradient(0deg, rgba(238,238,238,0.75) 0%, rgba(255,255,255,1) 30%);
	content: "";
	z-index: -1;
}


.contents-intro:after{
	position: absolute;
	left: 0;
	right: 0;
	bottom: -10%;
	margin: auto;
	width: 100%;
	max-width: 1080px;
	height: 160%;
	display: block;
	background: url(/media/recipient/img/bg_jhdc.svg) center right no-repeat;
	background-size: contain;
	content: "";
	opacity: 0.2;
	z-index: -1;
}


.contents-intro .inner{
	position: relative;
	margin: auto;
	padding: 0;
	width: 94%;
	max-width: 1080px;
	height: 12em;
	display: flex;
	align-items: center;
	align-content: center;
	justify-content: flex-start;
	flex-wrap: wrap;
}


.contents-intro .inner .contents-title{
	position: relative;
	margin: 0;
	padding: 0 0 0 1.8em;
	color: #008eca;
	font-size: 2.4rem;
	font-weight: 500;
	line-height: 1.4;
}

.contents-intro .inner .contents-title:before{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 4rem;
	height: 4rem;
	display: block;
	content: "";
}

.talk-room .contents-intro .inner .contents-title:before,
.talkroom .contents-intro .inner .contents-title:before{
	width: 4rem;
	height: 4rem;
	background: url(/media/recipient/img/icon_talk.svg) center center no-repeat;
	background-size: contain;
}

.form .contents-intro .inner .contents-title:before{
	width: 3.8rem;
	height: 3.8rem;
	background: url(/media/recipient/img/icon_camera.svg) center center no-repeat;
	background-size: contain;
}

.form.basic .contents-intro .inner .contents-title:before{
	width: 3.8rem;
	height: 3.8rem;
	background: url(/media/recipient/img/icon_form.svg) center center no-repeat;
	background-size: contain;
}

.faq .contents-intro .inner .contents-title:before{
	width: 3.8rem;
	height: 3.8rem;
	background: url(/media/recipient/img/icon_q.svg) center center no-repeat;
	background-size: contain;
}

.login .contents-intro .inner .contents-title:before{
	width: 3.8rem;
	height: 3.8rem;
	background: url(/media/recipient/img/icon_login.svg) center center no-repeat;
	background-size: contain;
}

.login .contents-intro .inner .contents-title.mypage:before,
.mypage .contents-intro .inner .contents-title:before{
	width: 3.8rem;
	height: 3.8rem;
	background: url(/media/recipient/img/icon_mypage.svg) center center no-repeat;
	background-size: contain;
}

.contents-intro .inner .catch-txt{
	position: relative;
	margin: 0;
	padding: 0.5em 0 0 0;
	width: 100%;
	font-size: 1.4rem;
	line-height: 1.6;
}


.section-title{
	position: relative;
	margin: 0 0 1em 0;
	padding: 0 0 0.2em 0;
	border-bottom: 1px dotted #999;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.6;
}

.contents-section{
	position: relative;
	margin: 3em auto 3em;
	width: 94%;
	max-width: 1000px;
	display: block;
}

.notice-txt{
	position: relative;
	margin: auto;
	padding: 1em;
	font-size: 1.6rem;
	line-height: 1.4;
	text-align: center;
}

.notice-txt span{
	position: relative;
	margin: auto;
	padding: 0 0 0 1.2em;
	display: inline-block;
	text-align: left;
}
.notice-txt span:before{
	position: absolute;
	top: 0;
	left: 0;
	padding: 0;
	color: #f30;
	font-size: 1.6rem;
	line-height: 1.4;
	content: "※";
}


.point.notice-txt span{ display: block;}


/* LOGIN */

.login .intro{
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 90%;
	max-width: 800px;
	display: block;
}

.login-block{
	position: relative;
	margin: 0 auto 2em;
	padding: 1.5em;
	width: 100%;
	display: block;
	overflow: hidden;
	border-radius: 0.6em;
	background-color: #eee;
}

.login-block input{
	position: relative;
	padding: 0.4em;
}

.login-block.re-set input{ margin: 0 0 1em;}



.login-block dl{
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	font-size: 1.6rem;
	line-height: 1.4;
}

.login-block dt{
	position: relative;
	margin: 0 0 1em 0;
	padding: 0;
	width: 5em;
	font-weight: 500;
}

.login-block dd{
	position: relative;
	margin: 0 0 1em 0;
	padding: 0;
	width: calc(100% - 5.5em);
}

.login .lead-txt{
	position: relative;
	margin: 0;
	padding: 1em 0;
	display: block;
	font-size: 1.8rem;
	font-weight: 300;
	line-height: 1.6;
}

.login .logout-button{
	position: relative;
	margin: 0 auto;
	padding: 1em 0;
	width: 80%;
	display: block;
}

.login .intro .button a{
	position: relative;
	margin: 1em 0;
	padding: 0.8em 0 0.8em 0.8em;
	width: 100%;
	display: block;
	border-radius: 2em;
	border: none;
	box-sizing: border-box;
	background-color: #008eca;
	color: #fff;
	font-size: 1.6rem;
	font-weight: 300;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}

.login .intro .button a:before{
	position: absolute;
	top: 0;
	left: 0.4em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 1.2rem;
	height: 1.2rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow_w.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}




/* HOME */

.home-intro{
	position: relative;
	margin: auto;
	padding: 0;
	width: 100%;
	display: block;
	overflow: hidden;
	z-index: auto;
}

.home-intro:before{
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	display: block;
	background: rgb(238,238,238);
	background: linear-gradient(0deg, rgba(238,238,238,0.75) 0%, rgba(255,255,255,1) 30%);
	content: "";
	z-index: -1;
}


.home-intro:after{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 100%;
	height: 100%;
	display: block;
	background: url(/media/recipient/img/bg_jhdc.svg) center right no-repeat;
	background-size: contain;
	content: "";
	opacity: 0.2;
	z-index: -1;
}

.home-intro .inner{
	position: relative;
	margin: auto;
	padding: 0;
	width: 94%;
	max-width: 1080px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}

.home-intro .main-image{
	margin: 0;
	padding: 1em 0 0;
	width: 180px;
	order: 1;
}

.home-intro .txt-box{
	margin:0;
	padding: 1em 0 2em 0;
	order: 2;
}

.home-intro .contents-title{
	position: relative;
	margin: 0;
	padding: 0 0 0 6rem;
	color: #f63;
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1.4;
}

.home-intro .contents-title:before{
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 5rem;
	height: 5rem;
	display: block;
	overflow: hidden;
	border-radius: 50%;
	content: "";
}

.step-01 .home-intro .contents-title:before{ background: url(/media/recipient/img/step_01.svg) center center no-repeat #f63; background-size: contain;}
.step-02 .home-intro .contents-title:before{ background: url(/media/recipient/img/step_02.svg) center center no-repeat #f63; background-size: contain;}
/*step-03メジャーメント*/
/*.step-03 .home-intro .contents-title:before{ background: url(/media/recipient/img/step_03.svg) center center no-repeat #f63; background-size: contain;}*/
.step-04 .home-intro .contents-title:before{ background: url(/media/recipient/img/step_03.svg) center center no-repeat #f63; background-size: contain;}
.step-05 .home-intro .contents-title:before{ background: url(/media/recipient/img/step_04.svg) center center no-repeat #f63; background-size: contain;}
.step-06 .home-intro .contents-title:before{ background: url(/media/recipient/img/step_05.svg) center center no-repeat #f63; background-size: contain;}
.step-07 .home-intro .contents-title:before{ background: url(/media/recipient/img/step_06.svg) center center no-repeat #f63; background-size: contain;}
.step-08 .home-intro .contents-title:before{ background: url(/media/recipient/img/step_07.svg) center center no-repeat #f63; background-size: contain;}
.step-09 .home-intro .contents-title:before{ background: url(/media/recipient/img/step_09.svg) center center no-repeat #f63; background-size: contain;}


.home-intro .contents-title span{
	padding: 0 0.8rem 0 0;
	color: #333;
	font-weight: 500;
}

.home-intro .contents-title em{
	padding: 0.5rem 0 0 0;
	display: block;
	font-size: 2.6rem;
	font-weight: 500;
	line-height: 1.2;
}

.home-intro .catch-txt{
	position: relative;
	margin: 0;
	padding: 1em 0 0 0;
	font-size: 1.4rem;
	line-height: 1.6;
}


.home-intro .button a{
	position: relative;
	margin: 1.5em auto 0;
	padding: 0.6em 2em 0.6em 2em;
	width: 90%;
	max-width: 24em;
	display: block;
	border-radius: 2em;
	border: none;
	box-sizing: border-box;
	background-color: #008eca;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}

.home-intro .button a:before{
	position: absolute;
	top: 0;
	left: 0.5em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 2rem;
	height: 2rem;
	display: block;
	background: url(/media/recipient/img/icon_camera_w.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}

.home-intro .button a:after{
	position: absolute;
	top: 0;
	right: 0.5em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 1.6rem;
	height: 1.6rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow_w.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}

.home-intro .txt-box .link-ul{
	width:100%;
	margin: 0 0 1em 0;
	letter-spacing: -.4em;
}

.home-intro .txt-box .link-ul li{
	letter-spacing:normal;
}

.home-intro .button.link a:before{
	background:none;
}

.home-intro .button.movie a {
	background-color: #f63;
}

.home-intro .button.movie a:before{
	background: url(/media/recipient/img/icon_movie.svg) center center no-repeat;
	background-size: contain;
}

@media screen and (min-width: 768px), print {
	.home-intro .txt-box.mt-1{
		margin: 1em 0 0 0;
	}
}

@media screen and (min-width: 1000px), print {
	.home-intro .txt-box .link-ul li{
		display: inline-block;
		width: 50%;
	}
}

/* STEP-SECTION */

.step-section-title{
	position: relative;
	margin: auto;
	padding: 1.5em 0;
	font-size: 2rem;
	line-height: 1.4;
	letter-spacing: 0.05em;
	text-align: center;
}
.step-section-title span{
	display: block;
	font-size: 1.4rem;
	letter-spacing: inherit;
}

.step-section-title:before{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 30px 0 30px;
	border-color: #f2f2f2 transparent transparent transparent;
	content: "";
}

.step-slider{
	position: relative;
	margin: auto;
	padding: 0;
	width: 100%;
	max-width: 1080px;
}

.step-slider .swiper-container:before,
.step-slider .swiper-container:after {
	position: absolute;
	top: 0;
	width: 1.5em;
	height: 100%;
	display: block;
	content: "";
	z-index: 10;
}

.step-slider .swiper-container:before { right: 0; background: linear-gradient(to right, rgba(255, 255, 255, 0), #fff);}
.step-slider .swiper-container:after { left: 0; background: linear-gradient(to left, rgba(255, 255, 255, 0), #fff);}


.swiper-button-prev:after,
.swiper-button-next:after {
	position: absolute;
	bottom: 70%;
	margin: auto;
	width: 3rem;
	height: 3rem;
	cursor: pointer;
	display: block;
	z-index: 100;
}

.swiper-button-next:after{
	left: -0.5em;
	background: url(/media/recipient/img/icon_arrow.svg) center center no-repeat;
	background-size: contain;
	content: "";
}

.swiper-button-prev:after{
	right: -0.5em;
	background: url(/media/recipient/img/icon_arrow.svg) center center no-repeat;
	background-size: contain;
	transform: scale(-1, 1);
	content: "";
}

.step-slider .step-image{
	position: relative;
	margin: auto;
	padding: 0;
	width: 80%;
	display: block;
}

.step-slider .step-image span{
	position: relative;
	margin: auto;
	padding: 0;
	width: 100%;
	display: block;
	overflow: hidden;
}

.step-slider .step-image img{
	position: relative;
	margin: 0 auto -5%;
	padding: 0;
	width: 70%;
	display: block;
}

.step-slider .step-image:after{
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	padding: 0;
	width: 100%;
	height: 90%;
	display: block;
	border-radius: 0.6em;
	background-color: #eee;
	content: "";
	z-index: -1;
}

.step-01 .step-slider .slide-01 .step-image:after,
.step-02 .step-slider .slide-02 .step-image:after,
.step-03 .step-slider .slide-03 .step-image:after,
.step-04 .step-slider .slide-04 .step-image:after,
.step-05 .step-slider .slide-05 .step-image:after,
.step-06 .step-slider .slide-06 .step-image:after,
.step-07 .step-slider .slide-07 .step-image:after,
.step-08 .step-slider .slide-08 .step-image:after,
.step-09 .step-slider .slide-09 .step-image:after{  background-color: #f93; /*background: rgb(255,153,51); background: linear-gradient(270deg, rgba(255,153,51,1) 0%, rgba(255,102,0,1) 100%); */}


.step-slider .step-image:before{
	position: absolute;
	bottom: 0;
	right: -22%;
	margin: 0;
	padding: 0;
	width: 20%;
	height: 90%;
	display: block;
	background: url(/media/recipient/img/icon_dott.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 50;
}

.step-slider .slide-09 .step-image:before{ display: none;}

.step-caption{
	position: relative;
	margin: 0.5em auto 0;
	padding: 0 0 0.5em 2.4rem;
	width: 80%;
	font-size: 1.3rem;
	font-weight: 500;
	line-height: 1.5;
}

.step-caption:before{
	position: absolute;
	left: 0;
	top: 0;
	margin: auto;
	padding: 0;
	width: 2rem;
	height: 2rem;
	display: block;
	overflow: hidden;
	border-radius: 50%;
	content: "";
}

.slide-01 .step-caption:before{ background: url(/media/recipient/img/no_01.svg) center center no-repeat #ccc; background-size: 70% 70%;}
.slide-02 .step-caption:before{ background: url(/media/recipient/img/no_02.svg) center center no-repeat #ccc; background-size: 70% 70%;}
/*slide-03メジャーメントステータス*/
/*.slide-03 .step-caption:before{ background: url(/media/recipient/img/no_03.svg) center center no-repeat #ccc; background-size: 70% 70%;}*/
.slide-04 .step-caption:before{ background: url(/media/recipient/img/no_03.svg) center center no-repeat #ccc; background-size: 70% 70%;}
.slide-05 .step-caption:before{ background: url(/media/recipient/img/no_04.svg) center center no-repeat #ccc; background-size: 70% 70%;}
.slide-06 .step-caption:before{ background: url(/media/recipient/img/no_05.svg) center center no-repeat #ccc; background-size: 70% 70%;}
.slide-07 .step-caption:before{ background: url(/media/recipient/img/no_06.svg) center center no-repeat #ccc; background-size: 70% 70%;}
.slide-08 .step-caption:before{ background: url(/media/recipient/img/no_07.svg) center center no-repeat #ccc; background-size: 70% 70%;}
/*.slide-09 .step-caption:before{ background: url(/media/recipient/img/no_09.svg) center center no-repeat #ccc; background-size: 70% 70%;}*/
.slide-09 .step-caption:before{ background: url(/media/recipient/img/step_09_image.svg) center center no-repeat #ccc; background-size: 100% 100%;}

.step-01 .slide-01 .step-caption:before,
.step-02 .slide-02 .step-caption:before,
.step-03 .slide-03 .step-caption:before,
.step-04 .slide-04 .step-caption:before,
.step-05 .slide-05 .step-caption:before,
.step-06 .slide-06 .step-caption:before,
.step-07 .slide-07 .step-caption:before,
.step-08 .slide-08 .step-caption:before,
.step-09 .slide-09 .step-caption:before{ background-color: #f60;}


/* home-inner */

.home-inner{
	position: relative;
	margin: 4em auto 0;
	width: 94%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.home-inner .congratulations{
	position: relative;
	margin: 0 0 6em 0;
	padding: 1.5em;
	width: 100%;
	display: block;
	overflow: hidden;
	border-radius: 0.6em;
	background-color: #eee;
}


.home-inner .congratulations .message{
	position: relative;
	margin: 0 0 0.5em 0;
	padding: 3.2rem 0;
	width: 100%;
	display: block;
	overflow: hidden;
	color: #00aeef;
	font-size: 2.2rem;
	line-height: 1.8;
	text-align: center;
	border: 6px solid #fff;
	background-color: #fff;
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
}


.home-inner .congratulations .message:before,
.home-inner .congratulations .message:after{
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 3.2rem;
	display: block;
	overflow: hidden;
	background: url(/media/recipient/img/bg_deco_left.svg) left top no-repeat,url(/media/recipient/img/bg_deco_right.svg) right top no-repeat, url(/media/recipient/img/bg_line.svg) left top repeat-x;
	background-size: contain;
	content: "";
	z-index: 100;
}


.home-inner .congratulations .message:after{
	top: inherit;
	bottom: 0;
	transform: scale(1, -1);
}

.home-inner .congratulations .message p{
	position: relative;
	margin: 0;
	padding:  1em 3.2rem;
	display: block;
}



.home-inner .congratulations .message p:before,
.home-inner .congratulations .message p:after{
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	width: 3.2rem;
	height: 100%;
	display: block;
	overflow: hidden;
	background: url(/media/recipient/img/bg_line_side.svg) left top repeat-y;
	background-size: contain;
	content: "";
	z-index: 10;
}

.home-inner .congratulations .message p:after{
	left: inherit;
	right: 0;
	transform: scale(-1, 1);
}

.home-inner .congratulations .message span{
	padding-top: 0.5em;
	display: block;
	font-size: 1.6rem;
}


.home-inner .congratulations .notice-txt span{
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.6;
}
.home-inner .congratulations .notice-txt strong{ color: #008fc2;}



.home-inner .home-section{
	position: relative;
	margin: 0 0 3em 0;
	width: 100%;
	display: block;
	overflow: hidden;
	border-radius: 0.6em;
	border: 2px solid #fff;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
}

.home-section .intro{
	position: relative;
	margin: 0;
	padding: 0 0.5em;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: rgb(0,174,239);
	background: linear-gradient(90deg, rgba(0,174,239,1) 0%, rgba(0,145,239,1) 100%);
}

.home-section.kaoru .intro{
	background: rgb(204,153,255);
	background: linear-gradient(90deg, rgba(204,153,255,1) 0%, rgba(204,124,255,1) 100%);
}

.home-section .home-section-title{
	position: relative;
	margin: 0;
	padding: 0.6em 0.5em 0.6em 1.6em;
	width: 100%;
	display: block;
	color: #fff;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: -0.05em;
	white-space: nowrap;
}

.home-section .home-section-title:before{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	width: 3rem;
	height: 3rem;
	display: block;
	content: "";
}

.home-section .home-section-title.talk:before{ background: url(/media/recipient/img/icon_talk_w.svg) center center no-repeat; background-size: contain;}
.home-section .home-section-title.faq:before{ width: 2.6rem; height: 2.6rem; background: url(/media/recipient/img/icon_q_w.svg) center center no-repeat; background-size: contain;}
.home-section .home-section-title.wig-link:before{ background: url(/media/recipient/img/icon_l_w.svg) center center no-repeat; background-size: contain;}

.home-section .intro .button a{
	position: absolute;
	top: 0;
	left: 0;
	padding: 0 0;
	width: 100%;
	height: 100%;
	display: block;
	overflow: hidden;
	line-height: 300;
}

.home-section .intro .button a:before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 1.6rem;
	height: 1.6rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow_w.svg) center center no-repeat;
	background-size: contain;
	content: "";
}

.home-inner .txt {
	margin:1em 1em 0em 1em;
	line-height: 1.6;
}

.talk-box{
	position: relative;
	margin: 1em;
	padding: 0.5em 0.5em 1em 1em;
	display: block;
	overflow: hidden;
	border-radius: 0.6em;
	background-color: #eee;
}

.talk-box:before{
	position: absolute;
	top: 0;
	left: 0.5em;
	width: calc(100% - 2em);
	height: 2.5em;
	display: block;
	background: rgb(238,238,238);
	background: linear-gradient(180deg, rgba(238,238,238,1) 25%, rgba(238,238,238,0) 100%);
	content: "";
	z-index: 100;
}

.talk-box:after{
	position: absolute;
	bottom: 0;
	left: 0.5em;
	width: calc(100% - 2em);
	height: 2.5em;
	display: block;
	background: rgb(238,238,238);
	background: linear-gradient(0deg, rgba(238,238,238,1) 25%, rgba(238,238,238,0) 100%);
	content: "";
	z-index: 100;
}

.talk-box .inner{
	position: relative;
	padding: 0 0.5em 0 0;
	height: 25em;
	display: block;
	overflow: auto;
}



.talk-box .ymd{
	position: relative;
	margin: 1.5em 0 0.5em;
	padding: 0;
	display: block;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
}

.talk-box .ymd:before,
.talk-box .ymd:after{
	padding: 0 0.2em;
	content: "-";
}

.talk-box dl{
	position: relative;
	margin: 0 0 1.5em 0;
	padding: 0;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	z-index: 1;
}

.talk-box dt{
	position: relative;
	margin: 0;
	padding: 5.2rem 0 0 0;
	width: 5rem;
	display: block;
	color: #666;
	font-size: 1.1rem;
	line-height: 1.2;
	text-align: center;
}

.talk-box .admin{ color: #083879;}
.talk-box .admin.important{ color: #e1670e;}
.talk-box .admin.important time::after{
  content: "重 要";
  margin: 0 0 0 1rem;
  padding: 0rem 0.6rem 0.2rem;
  background: #f39c5c;
  border-radius: 0.5rem;
  font-size: 1.2rem;
  line-height: 1;
  color: #fff;
}


.talk-box dt img{
	position: absolute;
	top: 0.4rem;
	left: 0;
	right: 0;
	margin: auto;
	padding: 0;
	width: 5rem;
	height: 5rem;
	display: block;
	border-radius: 50%;
	background-color: #fff;
}

.talk-box .user dt img{
	width: 4.6rem;
	height: 4.6rem;
	border-radius: 0;
	background-color: transparent;
}

/*
.talk-box dt:before{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: 0;
	padding: 0;
	width: 5rem;
	height: 5rem;
	display: block;
	border-radius: 50%;
	background: url(/media/recipient/img/icon_admin.svg) center center no-repeat #fff;
	background-size: contain;
	content: "";
}


.talk-box .user dt:before{
	border-radius: 0;
	background: url(/media/recipient/img/ST_cat.png) center center no-repeat;
	background-size: 4.6rem;
}
*/
.talk-box .user dt{ order: 2;}

.talk-box dd{
	position: relative;
	margin: 0;
	padding: 1em;
	width: calc(100% - 6.5rem);
	display: block;
	background-color: #fff;
	border-radius: 0.6em;
	font-size: 1.4rem;
	line-height: 1.5;
	text-align: left;
}

.talk-box .user dd{ order: 1;}


.talk-box dd:before{
	position: absolute;
	top: 1.5rem;
	left: -1.2rem;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7px 14px 7px 0;
	border-color: transparent #fff transparent transparent;
	content: "";
}

.talk-box .user dd:before{
	position: absolute;
	top: 1.5rem;
	left: inherit;
	right: -1.2rem;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7px 0 7px 14px;
	border-color: transparent transparent transparent #ffffff;
	content: "";
}

.talk-box dd time{
	padding: 0.3em 0 0 0;
	display: block;
	color: #666;
	font-size: 1.3rem;
	line-height: 1.5;
	text-align: left;
}

.talk-box dd .delete{
	position: absolute;
	bottom: 0.8em;
	right: 1em;
	padding: 0 0 0 1.2em;
	display: block;
	color: #c00;
	font-size: 1.3rem;
	line-height: 1.5;
	text-align: left;
	cursor: pointer;
}

.talk-box dd .delete:before{
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	color: #c00;
	font-size: 1.3rem;
	line-height: 1.5;
	content: "×";
}



.talk-box .link{
	position: relative;
	margin-top: 2em;
	padding: 1.5em 0 2em;
	border-top: 1px dotted #999;
	text-align: center;
}

.talk-box .link a{
	position: relative;
	margin: 0;
	padding: 0 0 0 1.5em;
	font-size: 1.6rem;
	line-height: 1.4;
	text-align: center;
	white-space: nowrap;
}

.talk-box .link a:before {
	position: absolute;
	top: 0;
	left: 0.5em;
	bottom: 0;
	margin: auto;
	width: 1.2rem;
	height: 1.2rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow.svg) center center no-repeat;
	background-size: contain;
	content: "";
}


.comment-input dl{
	position: relative;
	margin: 0;
	padding: 1em 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
}



.comment-input dt{
	position: relative;
	margin: 0;
	padding: 5.2rem 0 0 0;
	width: 5rem;
	display: block;
	color: #666;
	font-size: 1.1rem;
	line-height: 1.2;
	text-align: center;
}

.comment-input dt img{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	padding: 0;
	width: 4.8rem;
	height: 4.8rem;
	display: block;
}

.comment-input dd{
	position: relative;
	margin: 0;
	padding: 0;
	width: calc(100% - 6.5rem);
	display: block;
}

.comment-input textarea,
.form-table textarea{
	position: relative;
	margin: 0;
	padding: 0.6em;
	width: 100%;
	display: block;
	box-sizing: border-box;
	background-color: #fff;
	border-radius: 0.4em;
	border: 1px solid #ccc;
	font-size: 1.6rem;
	line-height: 1.5;
	text-align: left;
}

.comment-input .submit,
.form .submit{
	margin: 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
}


.login-block button,
.comment-input button,
.form button,
.home-section .link-button a,
.onewig .link-button a{
	position: relative;
	margin: 1.5em auto 1em;
	padding: 0.6em 0 0.6em 1em;
	width: 48%;
	max-width: 22em;
	display: block;
	border-radius: 2em;
	border: none;
	box-sizing: border-box;
	background-color: #008eca;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}

.login-block button{ margin: auto;}

.submit button.kaoru{
	background-color:#cc99ff;
}

.home-section .link-button a,
.onewig .link-button a{
	width: 90%;
	font-size: 1.6rem;
}

.comment-input button:before,
.form button:before,
.home-section .link-button a:before{
	position: absolute;
	top: 0;
	left: 0.5em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 2.4rem;
	height: 2.4rem;
	display: block;
	background: url(/media/recipient/img/icon_pen.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}

/*
.login-block button:before{
	position: absolute;
	top: 0;
	left: 0.5em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 2.4rem;
	height: 2.4rem;
	display: block;
	background: url(/media/recipient/img/icon_login_w.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}
*/

.form button:before,
.onewig .link-button a:before{
	width: 1.8rem;
	height: 1.8rem;
	background: url(/media/recipient/img/icon_arrow_w.svg) center center no-repeat;
	background-size: contain;
}

.comment-input .submit .reset,
.form .submit .return,
.form .submit .reset{ background-color: #999;}

.comment-input .reset:before,
.form .reset:before{ background: url(/media/recipient/img/icon_reset.svg) center center no-repeat; background-size: contain;}

.home-section .faq-box{
	position: relative;
	margin: 1em 0 0;
	padding: 1em;
	width: 100%;
	display: block;

}

.home-section .faq-box .faq-sub-title a{
	position: relative;
	margin: 0 0 1em;
	padding: 0.5em 0 0.5em 2em;
	display: block;
	border-radius: 2em;
	background-color: #00aeef;
	color: #fff;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.5;
}

.home-section .faq-box .faq-sub-title a:before{
	position: absolute;
	left: 0.5em;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 1.6rem;
	height: 1.6rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow_w.svg) center center no-repeat;
	background-size: contain;
	content: "";
}

.home-section .faq-box ul{
	position: relative;
	margin: 0 0 2em 0;
	padding: 0;
	display: block;
}

.home-section .faq-box li{
	position: relative;
	margin: 0 0 0.8em 0.5em;
	padding: 0;
	display: block;
}

.home-section .faq-box li a{
	position: relative;
	margin: 0;
	padding: 0 0 0 1.6em;
	display: block;
	font-size: 1.6rem;
	line-height: 1.5;
}

.home-section .faq-box li a:before{
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	width: 2.2rem;
	height: 2.2rem;
	display: block;
	background: url(/media/recipient/img/icon_q.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}



.home-section .faq-search{
	position: relative;
	margin: 1em 0 0;
	padding: 1em;
	display: block;
	border-radius: 0.6em;
	background-color: #eee;
}

.home-section .faq-search .txt{
	margin: 0;
	padding: 0 0 1em;
	font-size: 1.4rem;
	line-height: 1.5;
}

.home-section .faq-search form{
	position: relative;
	margin: 0;
	padding: 0.3em 0.5em 0.3em 0.8em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: 2em;
	background-color: #fff;
	box-shadow: 1px 1px 2px 0px rgba(153,153,153,0.6) inset;
}

.home-section .faq-search form input{
	position: relative;
	padding: 0.4em 0.2em;
	width: calc(100% - 6.5em);
	display: block;
	outline: none;
	border: none;
	border-radius: 0.4em;
	background-color: transparent;
	box-sizing: border-box;
	font-size: 1.4rem;
}



.home-section .faq-search button{
	position: relative;
	margin: 0;
	padding: 0.4em 0 0.4em 1.6em;
	width: 6.5em;
	display: block;
	border-radius: 2em;
	border: none;
	box-sizing: border-box;
	background-color: #00aeef;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}

.home-section .faq-search button:before{
	position: absolute;
	top: 0;
	left: 0.4em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 1.8rem;
	height: 1.8rem;
	display: block;
	background: url(/media/recipient/img/icon_search.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}



/* talk-section */

body.talk{ background-color: #eee;}


.about-aside{
	position: relative;
	margin: 3em auto 3em;
	padding: 1.5em 1em;
	width: 94%;
	max-width: 1000px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	border-radius: 0.5em;
	border: 1px solid #c9f;
}

.about-aside h2{
	position: relative;
	margin: 0 0 0.5em;
	width: 100%;
	color: #96c;
	font-size: 2.4rem;
	line-height: 1.6;
	text-align: center;
}

.about-aside .txt{
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	font-size: 1.6rem;
	line-height: 1.8;
	text-align: left;
}

.about-aside .photo{
	position: relative;
	margin: 0 auto 1em;
	width: 10rem;
}


.about-aside .photo-list{
	margin: 1em 0 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.about-aside .photo-list li{
	margin: 0;
	width: 32%;
}



.talk-section{
	position: relative;
	margin: 3em auto 3em;
	width: 94%;
	max-width: 1000px;
	display: block;
}

.talk-section-body{
	margin: auto;
	width: 100%;
	max-width: 800px;
	display: block;
}

.point li{
	position: relative;
	margin: 0 0 0.5em 1.5em;
	padding: 0;
	list-style: disc;
	font-size: 1.4rem;
	line-height: 1.6;
	text-align: left;
}
.talk-section .talk-box{ margin: 1em 0;}


.talk-section .talk-box:before,
.talk-section .talk-box:after{ width: calc(100% - 1.5em);}

.talk-section .talk-box .inner{
	width: 100%;
	height: 60vh;
}


.talk-box .talk-title{
	position: relative;
	margin: 0.5em 0;
	padding: 1em 0 1em;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
}

.home .talk-box .talk-title{
	position: relative;
	margin: 0;
	padding: 1em 0;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
}

.talk-box .talk-title:before,
.talk-box .talk-title:after{
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	width: calc(50% - 4.5em);
	height: 1px;
	background-color: #ccc;
	content: "";
}

.talk-box .talk-title:before{ left: 0;}
.talk-box .talk-title:after{ right: 0;}

.talk-box .talk-title span:before{
	position: absolute;
	bottom: -0.5rem;
	left: 0;
	right: 0;
	margin: auto;
	width: 3.4rem;
	height: 1.8rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow.svg) no-repeat;
	background-size: contain;
	content: "";
	animation: arrow 1.5s ease-in-out infinite;
	transform:rotate(90deg);
	z-index: 100;
}

@keyframes arrow {
	0% { background-position: left center; opacity: 0;}
	50% { background-position: center center; opacity: 1;}
	100% { background-position: right center; opacity: 0;}
}


/* form */

.form-section{
	position: relative;
	margin: 3em auto 3em;
	width: 94%;
	max-width: 1000px;
	display: block;
}

.form-sub-title{
	position: relative;
	margin: 0 0 1em 0;
	padding: 0 0 0 3.4rem;
	color: #008eca;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.6;
}

.form-sub-title:before{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	margin: 0;
	padding: 0;
	width: 2.6rem;
	height: 2.6rem;
	display: block;
	background: url(/media/recipient/img/icon_camera.svg) center center no-repeat;
	background-size: contain;
	content: "";
}

.sample-photo{
	position: relative;
	margin: 0 auto;
	width: 94%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.sample-photo:after {
	width: 31%;
	height: 0;
	display: block;
	content: "";
}

.sample-photo li{
	margin: 0;
	padding: 0 0 1em;
	width: 31%;
}

.sample-photo .photo{
	margin: 0 auto 0.5em;
	width: 100%;
	display: block;
	border: 1px solid #ccc;
}

.sample-photo .caption{
	margin: 0 0 1em 0;
	font-size: 1.4rem;
	line-height: 1.6;
}

.sample-notice{
	margin: 0 auto;
	width: 94%;
}



.form-table{
	margin: auto;
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #ccc;
	background-color: #fff;
	font-size: 1.6rem;
	line-height: 1.5;
}

.form-table th{
	padding: 1em;
	width: 100%;
	display: block;
	background-color: #eee;
	border-bottom: 1px dotted #ccc;
	font-weight: normal;
	text-align: left;
	vertical-align: middle;
}

.form-table th span{
	margin: 0 0 0 0.5em;
	padding: 0.1em 0.5em;
	background-color: #c00;
	color: #fff;
	font-size: 1.1rem;
	font-weight: bold;
	letter-spacing: 0.1em;
	line-height: 1.2;
	text-align: center;
	white-space: nowrap;
}

.form-table td{
	padding: 1em;
	width: 100%;
	display: block;
	background-color: #fff;
	font-size: 1.6rem;
	text-align: left;
	vertical-align: middle;
}

.form-table tr.error th{ background-color: #ffd5d5;}
.form-table tr.error td{ background-color: #ffeaea;}

.form-table tr.error .error-msg{
	text-align: left;
	margin: 0;
	padding: 0 0 1em 0;
	display: block;
	color: #c00;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.4;
}


.form-table td .point{ padding: 0 0 0.5em 0;}

.form-photo input[type=file] { display: none;}

.form-photo{
	margin: 0 0 0.8em 0;
	padding: 0 0 0.8em 0;
	display: block;
	position: relative;
	border-bottom: 1px dotted #999;
}

.form-photo label {
	margin-right: 1em;
	position: relative;
	padding: 0.4em 2em;
	display: inline-block;
	border-radius: 2em;
	background: #00aeef;
	color: #fff;
	font-size: 1.4rem;
	line-height: 1.4;
	cursor: pointer;
}

.form-photo label:after {
	position: absolute;
	right: -10em;
	content: "選択されていません";
	color: #333;
	font-size: 1.4rem;
	height: 2em;
	line-height: 1.5em;
}
.form-photo label.changed:after { content: "";}
.form-photo .filename { font-size: 1.4rem;}

.form-table .photo{
	margin: 0.5em 0 -1em 0;
	width: 100%;
	max-width: 120px;
	display: block;
}

.form-table .face-radio{
	float: left;
	margin: 0;
	width: 18em;
	display: block;
}

.form-table .face-radio li{
	float: left;
	margin: 0;
	width: 50%;
	max-width: 9em;
	display: block;
}

.form-table .face-ng{
	float: left;
	margin: 0;
	padding: 1em 0 0;
	width: calc(100% - 18em);
	display: block;
	overflow: hidden;
}



.form-table .face-radio li .radio + label:before{ display: none;}
.form-table .face-radio li .radio:checked + label:after{display: none;}


.form-table .face-radio li .radio + label em{ position: relative; left: -1.5em; padding-left: 1.5em;}

.form-table .face-radio li .radio + label em:before{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	width: 14px;
	height: 14px;
	display: block;
	border: 1px solid #999;
	border-radius: 50%;
	content: "";
}

.form-table .face-radio li .radio:checked + label em:after{
	position: absolute;
	top: 0;
	left: 3px;
	bottom: 0;
	margin: auto;
	width: 10px;
	height: 10px;
	display: block;
	background: #207fdc;
	border-radius: 50%;
	content: "";
}


.form-table .face-radio .confirm{
	float: none;
	margin: 0;
	width: 50%;
	max-width: 120px;
	display: block;
	text-align: center;
	font-weight: 500;
}

.form-table .face-radio .confirm .photo{ margin: 0.5em 0 0;}


.confirm-photo{
	position: relative;
	margin: 0 auto 0;
	width: 100%;
	display: block;
}

.confirm-photo li{
	float: left;
	margin: 0;
	padding: 0 0.5em 1.5em 0.5em;
	width: 33.3333333333333333333333333333333333333333%;
	display: block;
	overflow: hidden;
}

.confirm-photo li img{
	display: block;
	width: 100%;
	border: 1px solid #ccc;
}

.confirm-photo .caption{
	margin: 0.5em 0 0 0;
	font-size: 1.4rem;
	line-height: 1.4;
	text-align: center;
}



.form-table .form-split-3,
.form-table .form-split-4,
.form-table .form-split-none{
	margin: 0;
	padding: 0;
	display: block;
}

.form-table .form-split-3 li{
	float: left;
	margin: 0;
	padding: 0 0 0.5em 0;
	display: block;
	width: 33.33333333333333333333333333333333333333333333%;
}

.form-table .form-split-4 li{
	float: left;
	margin: 0;
	padding: 0 0 0.5em 0;
	display: block;
	width: 25%;
}

.form-table .form-split-none li{
	margin: 0;
	padding: 0 0 0.5em 0;
	display: block;
}

.form-table .nowrap{ white-space: nowrap;}

.form-table li.half{ width: 50%;}

.form-table li.full,
.form-table .form-split-4 li.full{
	float: inherit;
	clear: both;
	margin: 0;
	padding: 0 0 0.5em 0;
	display: block;
	width: 100%;
}

.form-table li.full div{ padding: 1em 0 0 0;}

.form-table .input-block{ overflow: hidden;}

.form-table .input-block input{ margin: 0 0 1em; width: 100%; display: block;}

.form-table .input-block input:last-child{ margin: 0;}

.form-table .input-block.size-ss input{margin: 0 0.5em 0 0; width: 5em; display: inline-block;}

.form-table .input-block.size-m input{margin: 0 0.5em 0 0; width: 35%; display: inline-block;}

.form-table .input-block.size-m button{
	position: relative;
	margin: 0;
	padding: 0.5em 0 0.5em 0.8em;
	width: 30%;
	max-width: 8em;
	display: inline-block;
	border-radius: 2em;
	border: none;
	box-sizing: border-box;
	background-color: #008eca;
	color: #fff;
	font-size: 1.3rem;
	font-weight: 300;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}

.form-table .input-block.size-m button:before{
	position: absolute;
	top: 0;
	left: 0.4em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 1.2rem;
	height: 1.2rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow_w.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}



.form-table .required input,
.form-table .required select{ background-color: azure;}


.form-table .name-dl{
	margin: 1.5em 0 0;
	padding: 0;
	display: block;
	width: 100%;
	font-size: 1.4rem;
	line-height: 1.4;
}

.form-table .name-dl dt{
	float: left;
	margin: 0;
	padding: 0.6em 0 0 1em;
	display: block;
	width: 4em;
}

.form-table .name-dl dd{
	float: left;
	margin: 0 0 1em 0;
	padding: 0;
	display: block;
	width: calc(50% - 4em);
}

.select-block{
	position: relative;
	display: block;
}

.form-table .select-block{ width: 100%;}

.form-table .select-block:after {
	position: absolute;
	top: 50%;
	right: 10px;
	margin-top: -4px;
	width: 6px;
	height: 6px;
	display: block;
	border-bottom: solid 2px #b4b3b3;
	border-right: solid 2px #b4b3b3;
	transform: rotate(45deg);
	content: "";
	pointer-events: none;
	z-index: 100;
}



.ymd-block .select-block{
	position: relative;
	display: inline-block;
}

.ymd-block .select-block{ margin-right: 0.5em; width: calc(100% - 3em);}






/* FAQ */

.faq .faq-anchor,
.onewig .onewig-anchor{
	position: relative;
	margin: 0 auto 2em;
	padding: 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.faq .faq-anchor:after,
.onewig .onewig-anchor:after{
	width: 32%;
	height: 0;
	display: block;
	content: "";
}

.faq .faq-anchor li,
.onewig .onewig-anchor li{
	position: relative;
	margin: 0 0 1em;
	padding: 0;
	width: 49%;
}

.faq .faq-anchor a,
.onewig .onewig-anchor a{
	position: relative;
	margin: 0;
	padding: 0.6em 0 0.6em 2em;
	display: block;
	border-radius: 2em;
	background-color: #00aeef;
	color: #fff;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.5;
}

.faq .faq-anchor a:before,
.onewig .onewig-anchor a:before{
	position: absolute;
	left: 0.5em;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 1.6rem;
	height: 1.6rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow_w.svg) center center no-repeat;
	background-size: contain;
	transform: rotate(90deg);
	content: "";
}


.faq .faq-search{
	position: relative;
	margin: 1em auto 3em;
	padding: 1em;
	width: 100%;
	max-width: 800px;
	display: block;
	border-radius: 0.6em;
	background-color: #eee;
}

.faq .faq-search .txt{
	margin: 0;
	padding: 0 0 1em;
	font-size: 1.6rem;
	line-height: 1.5;
}

.faq .faq-search form{
	position: relative;
	margin: 0;
	padding: 0.3em 0.5em 0.3em 0.8em;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-radius: 2em;
	background-color: #fff;
	box-shadow: 1px 1px 2px 0px rgba(153,153,153,0.6) inset;
}

.faq .faq-search form input{
	position: relative;
	padding: 0.4em 0.2em;
	width: calc(100% - 6.5em);
	display: block;
	outline: none;
	border: none;
	border-radius: 0.4em;
	background-color: transparent;
	box-sizing: border-box;
	font-size: 1.6rem;
}

.faq .faq-search button{
	position: relative;
	margin: 0;
	padding: 0.4em 0 0.4em 1.6em;
	width: 6.5em;
	display: block;
	border-radius: 2em;
	border: none;
	box-sizing: border-box;
	background-color: #00aeef;
	color: #fff;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}

.faq .faq-search button:before{
	position: absolute;
	top: 0;
	left: 0.4em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 1.8rem;
	height: 1.8rem;
	display: block;
	background: url(/media/recipient/img/icon_search.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}



.mypage .inner-section,
.faq .inner-section,
.onewig .inner-section{
	position: relative;
	margin: 0 auto 4em;
	padding: 0;
	width: 100%;
	display: block;
	overflow: hidden;
	border-radius: 0.6em;
	border: 2px solid #fff;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
}

.faq .inner-section .q-title{
	position: relative;
	margin: 0 0 1em 0;
	padding: 0.6em 0.6em 0.6em 2.5em;
	background: rgb(0,174,239);
	background: linear-gradient(90deg, rgba(0,174,239,1) 0%, rgba(0,145,239,1) 100%);
	color: #fff;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.4;
}

.faq .inner-section .q-title:before{
	position: absolute;
	top: 0;
	left: 0.5em;
	bottom: 0;
	margin: auto;
	width: 2.6rem;
	height: 2.6rem;
	display: block;
	background: url(/media/recipient/img/icon_q_w.svg) center center no-repeat;
	background-size: contain;
	content: "";
}


.mypage .inner-section .sub-title,
.onewig .inner-section .sub-title{
	position: relative;
	margin: 0 0 1em 0;
	padding: 0.6em 0.6em 0.6em 0.6em;
	background: rgb(0,174,239);
	background: linear-gradient(90deg, rgba(0,174,239,1) 0%, rgba(0,145,239,1) 100%);
	color: #fff;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.4;
}


.q-list{
	position: relative;
	margin: 0 auto;
	padding: 1em 1em 2em 1em;
	display: block;
}

.q-list li{
	position: relative;
	margin: 0 1em 1.5em 1em;
	padding: 0 0 0.5em 0;
	display: block;
	border-bottom: 1px dotted #999;
}

.q-list li:last-child{ border: none;}

.q-list li a{
	position: relative;
	margin: 0;
	padding: 0 0 0 1.6em;
	display: block;
	font-size: 1.6rem;
	line-height: 1.5;
}

.q-list li a:before{
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	width: 2.2rem;
	height: 2.2rem;
	display: block;
	background: url(/media/recipient/img/icon_q.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}


.faq-section{
	margin: 3em auto;
	width: 94%;
	max-width: 800px;
	display: block;
}

.inner-section .answer{
	position: relative;
	margin: 0;
	padding: 0 1em 0.5em 5rem;
	display: block;
}

.inner-section .answer:before{
	position: absolute;
	top: 0;
	left: 1em;
	width: 2.4rem;
	height: 2.4rem;
	margin: 0;
	padding: 0;
	display: block;
	background: url(/media/recipient/img/icon_a.svg) center center no-repeat;
	background-size: contain;
	content: "";
}


.inner-section .answer .txt{
	margin: 0;
	padding: 0 0 1em 0;
	font-size: 1.6rem;
	line-height: 1.6;
}

.inner-section .faq-photo{
	position: relative;
	margin: 0 auto 1em;
	padding: 0;
	width: 100%;
	max-width: 600px;
	display: block;
}

.faq-section .type-movie{
    position: relative;
    margin: 1em auto 0.5em;
    padding: 0;
    width: 100%;
    max-width: 400px;
    display: block;
}

.faq-section .type-movie img{
    border: 1px solid #00aeef;
}

.faq-section .type-movie p{
    text-align: center;
    margin-top: 0.5em;
    font-size: 1.6rem;
	line-height: 1.6;
}


/* WIG-INFO-BOX */

.home-section .wig-info-box{
	position: relative;
	margin: 1em auto 0;
	padding: 1em 1em 2em;
	width: 100%;
	display: block;
	text-align: center;
}

.home-section .wig-info-box .type-movie{
    position: relative;
    margin: 1em auto 0.5em;
    padding: 0;
    width: 100%;
    max-width: 400px;
    display: block;
}

.home-section .wig-info-box .type-movie img{
    border: 1px solid #00aeef;
}

.home-section .wig-info-box .type-banner{
    position: relative;
    margin: 1em auto 0.5em;
    padding: 0;
    width: 100%;
    max-width: 600px;
    display: block;
}

.home-section .wig-info-box a{
    display: inline-block;
}

.home-inner .wig-info-box p{
    text-align: center;
    margin-top: 0.5em;
    font-size: 1.6rem;
	line-height: 1.6;
}

.br_sp{
	display:block;
}

@media screen and (min-width: 768px) {
	.home-section .wig-info-box{
		position: relative;
		margin: 1em auto 0;
		padding: 1em 0 2em;
		width: 100%;
		max-width: 600px;
		display: block;
	}

	.br_sp{
		display:none;
	}
}


/* MYPAGE */

.mypage .inner-section .inner,
.onewig .inner-section .inner{
	position: relative;
	margin: 0;
	padding: 1em 1.5em;
	width: 100%;
	display: block;
	font-size: 1.6rem;
	line-height: 1.6;
}

.mypage .inner-section .txt,
.onewig .inner-section .txt{
	position: relative;
	margin: 0;
	padding: 0 0 1.5em;
	width: 100%;
	display: block;
	font-size: 1.6rem;
	line-height: 1.6;
}

.mypage .inner-section .wig-image{
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.mypage .inner-section .wig-image li{
	position: relative;
	margin: 0;
	padding: 0 0 1em 0;
	width: 23%;
}

.mypage .inner-section .wig-image .caption{
	position: relative;
	margin: 1em 0 0 0;
	padding: 0;
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	justify-content: flex-start;
	font-size: 1.5rem;
	line-height: 1.4;
	text-align: left;
}

.mypage .inner-section .wig-image .caption span{
	position: relative;
	margin: 0 0 0 0.5rem;
	padding: 0.2em 0.5em;
	display: block;
	background-color: #00aeef;
	border-radius: 0.2em;
	color: #fff;
	font-size: 1.2rem;
	line-height: 1.4;
	text-align: center;
	white-space: nowrap;
}


.mypage .inner-basic{
	position: relative;
	margin: 1em;
	padding: 1em;
	display: block;
	border-radius: 0.4em;
	background-color: #eee;
}

.mypage .inner-basic dl{
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	font-size: 1.6rem;
	line-height: 1.6;
}

.mypage .inner-basic dl dt{
	position: relative;
	margin: 0;
	padding: 0.5em;
	width: 12em;
	font-weight: bold;
}

.mypage .inner-basic dl dd{
	position: relative;
	margin: 0;
	padding: 0.5em 0 0.5em 2em;
	width: calc(100% - 12em);
	letter-spacing: 0.05em;
}


.mypage .inner-basic .notice-txt{ width: 100%; line-height: 1.6;}


.mypage .inner-basic .presonal{
	position: relative;
	margin: 0;
	padding: 0 0 2em 0;
	width: 100%;
	display: flex;
	align-items: center;
}

.mypage .inner-basic .presonal-icon{
	position: relative;
	margin: 0;
	padding: 0.5em;
	width: 8rem;
	height: 8rem;
	display: block;
	border-radius: 0.4em;
	background-color: #fff;
}

.mypage .inner-basic .presonal dt{
	position: relative;
	margin: 0;
	padding: 0;
	width: 8rem;
	display: block;
}

.mypage .inner-basic .presonal dt a{
	position: absolute;
	bottom: -2em;
	left: 0;
	right: 0;
	padding: 0.5em 0 0;
	display: block;
	font-size: 1.2rem;
	line-height: 1.4;
	text-align: center;
}

.mypage .inner-basic .presonal dd{
	position: relative;
	margin: 0;
	padding: 0;
	width: calc(100% - 10rem);
	display: block;
}

.mypage .inner-basic .presonal em{
	margin: 0;
	padding: 0.5rem 0 0;
	display: block;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.4;
}

.mypage .inner-basic .edit{
	position: relative;
	margin: 1.5em 0 0;
	padding: 0 0 1em;
	width: 100%;
	border-top: 1px dotted #999;

}

.mypage .inner-basic .edit a{
	position: relative;
	margin: 1.5em auto 0;
	padding: 0.6em 2em 0.6em 2em;
	width: 90%;
	max-width: 24em;
	display: block;
	border-radius: 2em;
	border: none;
	box-sizing: border-box;
	background-color: #008eca;
	color: #fff;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}


.mypage .inner-basic .edit a:before{
	position: absolute;
	top: 0;
	right: 0.5em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 1.6rem;
	height: 1.6rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow_w.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}




.mypage .decline-info{
	margin: auto;
	padding: 1em 1em;
	display: block;
	color: #666;
	font-size: 1.4rem;
	line-height: 1.6;
	text-align: center;
}










/* TALK */

.iframe-wrap{
	position: relative;
	padding: 28em 0 0;
	width: 100%;
	height: 0;
	display: block;
	overflow:auto;
	-webkit-overflow-scrolling:touch;
	border-radius: 0.6em;
	background-color: #eee;
}

.home .iframe-wrap{
	margin: 1em;
	padding: 30em 0 0;
	width: calc(100% - 2em);
}

.iframe-wrap:before{
	position: absolute;
	top: 0;
	left: 0;
	width: calc(100% - 1em);
	height: 2.5em;
	display: block;
	background: rgb(238,238,238);
	background: linear-gradient(180deg, rgba(238,238,238,1) 25%, rgba(238,238,238,0) 100%);
	content: "";
	z-index: 100;
}

.iframe-wrap:after{
	position: absolute;
	bottom: 0;
	left: 0;
	width: calc(100% - 1em);
	height: 2.5em;
	display: block;
	background: rgb(238,238,238);
	background: linear-gradient(0deg, rgba(238,238,238,1) 25%, rgba(238,238,238,0) 100%);
	content: "";
	z-index: 100;
}

.iframe-wrap iframe{
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
		display:block;
}

.talk .talk-box{
	position: relative;
	margin: 0;
	padding: 0.5em 0.5em 1em 1em;

	display: block;
	overflow: hidden;
	border-radius: 0;
	background-color: #eee;
}

.talk .talk-box:before,
.talk .talk-box:after{ display: none;}

.talk .talk-box .inner{
	position: relative;
	padding: 0 0.5em 0 0;
		width: 100%;
	height: auto;
	display: block;
	overflow: hidden;
}



/* ONEWIG */
.onewig img{display: block; width: 100%; border-radius: 0.4em; }
.onewig .inner-basic{
	margin: 1em;
	padding: 1em;
	display: block;
	border-radius: 0.4em;
}
.onewig .inner-onewig{ background: #EDF7FC; border-radius: 0.4em; padding: 1.5em; }
.onewig .list-ol{ counter-reset:list; }
.onewig .list-ol li.number-ol{
	position:relative;
}
.onewig .list-ol li.number-ol:before{
	counter-increment: list;
	content: counter(list) ".";
	position: absolute;
	left: 15px;
	top: 1.2em;
	font-size: 1.8rem;
	color: #008fc2;
	font-weight:bold;
}
.onewig h4.ol-title{
	font-size: 1.8rem;
	color: #008fc2;
	font-weight:bold;
	line-height: 1.4;
	background-color: #f1f1f1;
	border-radius: 0.4em;
	padding: 1em 1em 1em 2.2em;
}
.onewig .next-arrow-bottom{
		position: relative;
		margin:0 auto;
		margin-bottom: 5em;
}
.onewig .next-arrow-bottom:after {
		position: absolute;
		left: 0;
		right: 0;
		bottom: -4em;
		margin: auto;
		width: 4rem;
		height: 4rem;
		display: block;
		background: url(/common/img/icon_arrow.svg) center center no-repeat;
		background-size: contain;
		transform: rotate( 90deg );
		content: "";
}
.onewig .list-ol .list-data{ padding: 1.5em; border-radius: 0.4em; border:2px solid #008fc2; margin-top: 1em; }
.onewig .list-ol dl{ display: table; width: 100%; margin-bottom: 1em; }
.onewig .list-ol dt{
	display: table-cell;
	width : -webkit-calc(100% - 230px) ;
	width : calc(100% - 230px) ;
	vertical-align: middle;
}
.onewig .list-ol dd{ max-width:230px; display: table-cell; vertical-align: middle; }
.onewig .list-ol dt strong{ display: block; padding-bottom: 1em; font-size: 1.8rem; }
.onewig .onewig-img01{ overflow: hidden; }
.onewig .onewig-img01 li{ width:48%; margin: 0 4% 4% 0; float: left; }
.onewig .onewig-img01 li:nth-child(2n){ margin-right: 0; }
.onewig .section-title.onewig-title03{ }
.onewig .section-title.onewig-title03 span{
		background: #F1F1F1;
		border: 1px solid #eee;
		border-radius: 0.4em;
		padding: 0.2em 1em;
		font-size: 1.4rem;
		white-space: nowrap;
}
.onewig .section-title.onewig-title03 span em{ color: #00aeef; padding: 0 0 0 0.5em; white-space: nowrap; }


@media screen and (max-width: 480px) {

.sp-none{ display: none;}
.sp-only{ display: block;}


/* FOOTER SP */

footer .foot-body{ font-size: 1.3rem;}

footer .foot-menu li{
	margin: 0 0 0.5em 0;
	padding: 0.4em 0;
	border: 1px dotted #fff;
	border-width: 0 1px;
	width: 50%;
	text-align: center;
}
footer .foot-menu li:last-child{ border-right:  1px dotted #fff;}
footer .foot-menu li:nth-child(2),
footer .foot-menu li:last-child{ border-left: none;}


/* HOME 480 */

.home-intro .main-copy{
	padding: 1em 0 0.5em;
	width: 100%;
	font-size: 3.2rem;
	text-align: center;
	line-height: 1.4;
}

.home-intro .main-copy span{ display: block;}

.home-intro .lead-txt{
	position: relative;
	padding: 0.5em 1.5em;
	font-size: 2rem;
	text-align: center;
	line-height: 1.4;
}

.home-intro .lead-txt:before{
	left: 0.8em;
	bottom: 0;
}

.home-intro .lead-txt:after{
	right: 0.8em;
	bottom: 0;
}

.home-intro .txt{
	padding: 1em 0 4em 0;
	width: 100%;
	font-size: 1.6rem;
	text-align: left;
	line-height: 1.6;
}


.home-charenge .charenge-title{
	position: relative;
	margin: auto;
	padding: 0;
	display: block;
	font-size: 2.2rem;
	line-height: 1.4;
	letter-spacing: 0.05em;
	text-align: center;
	z-index: 10;
}

.home-charenge .charenge-title span{
	margin: 0 0.5rem 0 0;
	font-size: 3.8rem;
	font-weight: 500;
	letter-spacing: inherit;
}

.home-charenge .charenge-title:after{
	position: absolute;
	top: -80%;
	right: -15%;
	margin: 0;
	width: 180px;
	height: 120px;
	z-index: -1;
}


.home-charenge .duck-info{ font-size: 1.8rem;}

.home-charenge .duck-info strong{ font-size: 3.2rem; line-height: 1.4;}

.home-charenge .duck-info span{ display: block;}

.home-charenge .cheering-comment li{ width: 50%;}

.home-charenge .cheering-comment li:nth-child(3){ display: none;}

.return-info .return-title{
	margin: 0 auto -1em;
	padding: 0.8em 0.5em 0.4em 0.5em;
	font-size: 2.4rem;
	line-height: 1.4;
}

.return-info .return-title:after{
	top: -1.2em;
	left: -0.8em;
}

.home-slider .home-slider-block{
	position: relative;
	margin: 0 auto 2em;
	padding: 0;
	width: 100%;
	display: block;
}

.return-info .return-notice{
	padding: 1em;
	font-size: 1.5rem;
}


.sample-photo li{
	margin: 0;
	width: 46%;
}

.form-table .form-split-3 li{ width: 100%;}

.form-table .form-split-4 li{ width: 50%;}
.form-table li.half{ width: 100%;}


.mypage .inner-section .wig-image li{
	margin: auto;
	width: 90%;
}


.form-table .face-radio{
	float: none;
	margin: 0;
	width: 100%;
	display: block;
}

.form-table .face-radio li{
	float: left;
	margin: 0;
	width: 50%;
	max-width: 10em;
	display: block;
}

.form-table .face-ng{
	float: none;
	margin: 0;
	width: 100%;
}

/* TALK SP */

.home .iframe-wrap{
	margin: 1em 0.5em;
	padding: 28em 0 0;
	width: calc(100% - 1em);
}


}/* SP480 */

@media screen and (max-width: 640px) {

.faq .faq-anchor li,
.onewig .onewig-anchor li{ width: 100%;}

.mypage .inner-section .wig-image li{
	position: relative;
	margin: 0;
	padding: 0 0 1em 0;
	width: 48%;
}

/* Onewig SP */
.onewig .list-ol dl{ display: block; }
.onewig .list-ol dt{  width : 100%; }
.onewig .list-ol dd{ max-width:230px; width: 100%; margin: 1em auto 0; display: inherit;  }
.onewig .onewig-img01 li{ width:100%; max-width: 640px; margin: 0 auto 4% auto; float: inherit; }

}/* SP640 */

@media screen and (orientation: portrait) {
	 /* TATE */

}




/* @media screen and (min-width: 768px), print { */
@media screen and (min-width: 1000px), print {

.wrap:before{ display: none;}

a{ transition: 0.3s ease-in-out;}
a:hover{ opacity: 0.6;}

.sp-block{ display: none;}
.sp-none{ display: block;}
.pc-block{ display: block;}
.pc-none{ display: block;}



/* HEADER TAB */

header{ height: 160px;}

header:before{
	top: 40px;
}

header .inner{
	position: relative;
	margin: auto;
	padding: 0;
	width: 94%;
	max-width: 1080px;
	height: 160px;
}

header .logo{ width: 246px;}

header .menu{
	margin: 0;
	width: calc(100% - 246px);
	height: 120px;
}

header .waiting{
	padding: 0 1em;
	font-size: 1.5rem;
	line-height: 1.4;
}

header .waiting strong{
	font-size: 2.6rem;
	font-weight: 600;
	line-height: 1.4;
}

header .trigger{ display: none;}

header .header-menu{
	position: inherit;
	top: inherit;
	margin: 0;
	display: block !important;
}

header .mypage-menu{
	margin: 2.8em 0 0 0;
	padding: 0;
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	background-color: inherit;
	border-bottom: none;
}
/**/
header .mypage-menu li:last-child{ order: -1;}
header .mypage-menu li:last-child span{ display: none;}

header .mypage-menu a{
	position: relative;
	margin: 0 0 0 0.6em;
	padding: 0.5em 0 0.5em 1.4em;
	font-size: 1.3rem;
	font-weight: 500;
}

header .contents-menu{
	position: absolute;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
	background-color: inherit;
}

header .contents-menu li{ margin: 0 0 0 2em;}

header .contents-menu li a{
	position: relative;
	margin: 0;
	padding: 0.2em 0 0.2em 1.8em;
	display: block;
	color: #fff;
}

header .contents-menu li a:before{
	width: 2.6rem;
	height: 2.6rem;
}

header .contents-menu li:nth-child(1) a:before{ background: url(/media/recipient/img/icon_talk_w.svg) center center no-repeat; background-size: contain;}
header .contents-menu li:nth-child(2) a:before{ background: url(/media/recipient/img/icon_talk_w.svg) center center no-repeat; background-size: contain;}
header .contents-menu li:nth-child(3) a:before{ width: 2.4rem;  height: 2.4rem; background: url(/media/recipient/img/icon_q_w.svg) center center no-repeat; background-size: contain;}
header .contents-menu li:last-child a:before{ width: 2.4rem;  height: 2.4rem; background: url(/media/recipient/img/icon_l_w.svg) center center no-repeat; background-size: contain;}

header .user-name{ font-size: 2rem;}



.login header .inner{width: 94%; padding: 1.4rem 0;}
.login header .header-menu{ display: none !important;}

/* CONTENTS TAB */


.contents-intro:after{
	position: absolute;
	left: 0;
	right: 0;
	bottom: -10%;
	margin: auto;
	width: 100%;
	max-width: 1080px;
	height: 160%;
	display: block;
	background: url(/media/recipient/img/bg_jhdc.svg) center right no-repeat;
	background-size: contain;
	content: "";
	opacity: 0.2;
	z-index: -1;
}

.contents-intro .inner{ height: 12em;}


.contents-intro .inner .contents-title{
	padding: 0 0 0 1.8em;
	font-size: 2.6rem;
}

.contents-intro .inner .contents-title:before{
	width: 4.4rem;
	height: 4.4rem;
}

.contents-intro .inner .catch-txt{
	font-size: 1.6rem;
	line-height: 1.6;
}


.section-title{
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.6;
}




/* HOME TAB */


.home-intro:after{
	top: -4em;
	width: 100%;
	max-width: 1280px;
	opacity: 0.4;
}


.home-intro .inner{
	justify-content: flex-start;
	flex-wrap: nowrap;
}

.home-intro .main-image{
	padding: 1em 0;
	width: 280px;
}

.home-intro .txt-box{ padding: 1em 0; width: calc(100% - 280px);}

.home-intro .contents-title{
	padding: 0 0 0 7rem;
	font-size: 1.6rem;
}

.home-intro .contents-title:before{
	width: 6rem;
	height: 6rem;
}

.home-intro .contents-title em{ font-size: 3rem;}

.home-intro .catch-txt{
	padding: 1.5em 0 0 0;
	font-size: 1.6rem;
}

.home-intro .button a{
	position: relative;
	margin: 1.5em auto 0;
	padding: 0.8em 2em 0.8em 2em;
	font-size: 1.6rem;
}

.home-intro .button a:before{
	width: 2.4rem;
	height: 2.4rem;
}

.home-intro .button a:after{
	width: 1.8rem;
	height: 1.8rem;
}


/* STEP-SECTION TAB */

.step-section-title{
	padding: 2em 0 1.5em;
	font-size: 2.4rem;
}
.step-section-title span{ display: inline-block;}

.step-section-title:before{ border-width: 28px 40px 0 40px;}

.step-slider .step-image img{
	position: relative;
	margin: 0 auto -5%;
	padding: 0;
	width: 70%;
	display: block;
}

.step-caption{
	padding: 0 0 0.5em 2.8rem;
	font-size: 1.4rem;
}

.step-caption:before{
	width: 2.4rem;
	height: 2.4rem;
}




/* home-inner TAB */

.home-inner{
	margin: 6em auto 0;
	width: 94%;
	max-width: 1080px;
}


.home-inner .congratulations .message{
	position: relative;
	margin: 0 0 0.5em 0;
	padding: 4.6rem 0;
	width: 100%;
	font-size: 2.6rem;
}


.home-inner .congratulations .message:before,
.home-inner .congratulations .message:after{ height: 4.6rem;}

.home-inner .congratulations .message p{ padding:  1em 4.6rem;}


.home-inner .congratulations .message p:before,
.home-inner .congratulations .message p:after{ width: 4.6rem;}

.home-inner .congratulations .message span{
	padding-top: 0.5em;
	display: block;
	font-size: 1.8rem;
}


.home-inner .home-section{
	margin: 0 0 4em 0;
  width: 48%;
}

.home-inner .home-section.w100{
	width:100%;
}

.home-section .home-section-title{
	position: relative;
	margin: 0;
	padding: 0.6em 0.5em 0.6em 1.7em;
	color: #fff;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: inherit;
}



.talk-box:before{
	position: absolute;
	top: 0;
	left: 0.5em;
	width: calc(100% - 2em);
	height: 2.5em;
	display: block;
	background: rgb(238,238,238);
	background: linear-gradient(180deg, rgba(238,238,238,1) 25%, rgba(238,238,238,0) 100%);
	content: "";
	z-index: 100;
}

.talk-box:after{
	position: absolute;
	bottom: 0;
	left: 0.5em;
	width: calc(100% - 2em);
	height: 2.5em;
	display: block;
	background: rgb(238,238,238);
	background: linear-gradient(0deg, rgba(238,238,238,1) 25%, rgba(238,238,238,0) 100%);
	content: "";
	z-index: 100;
}

.talk-box .inner{
	position: relative;
	padding: 0 0.5em 0 0;
	height: 32em;
	display: block;
	overflow: auto;
}


.talk-box dt{
	padding: 6.2rem 0 0 0;
	width: 6rem;
	font-size: 1.2rem;
}

.talk-box dt img{
	width: 5.8rem;
	height: 5.8rem;
}

.talk-box .user dt img{
	width: 5.6rem;
	height: 5.6rem;
	border-radius: 0;
	background-color: transparent;
}

.talk-box dd{
	width: calc(100% - 7.5rem);
	font-size: 1.4rem;
	line-height: 1.6;
}

.talk-box dd:before{ top: 2.5rem;}

.talk-box .user dd:before{ top: 2.5rem;}

.comment-input dt{
	padding: 6.2rem 0 0 0;
	width: 6rem;
	font-size: 1.2rem;
}

.comment-input dt img{
	width: 5.8rem;
	height: 5.8rem;
	display: block;
}

.comment-input dd{ width: calc(100% - 7.5rem);}


.comment-input .submit{
	margin: 0 0 0 7.5rem;
	width: calc(100% - 7.5rem);
}

.form .submit{
	margin: 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.login-block button,
.comment-input button,
.form button,
.home-section .link-button a,
.onewig .link-button a{
	position: relative;
	margin: 1.5em auto 1em;
	padding: 0.6em 0 0.6em 1em;
	width: 90%;
	max-width: 22em;
	display: block;
	border-radius: 2em;
	border: none;
	box-sizing: border-box;
	background-color: #008eca;
	color: #fff;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
	z-index: 1;
}

.home-section.kaoru .link-button a{
	background-color: #cc99ff;
}

.login-block button{ margin: 1em auto 0;}

.comment-input button:before,
.form button:before,
.home-section .link-button a:before{
	position: absolute;
	top: 0;
	left: 0.5em;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 2.6rem;
	height: 2.6rem;
	display: block;
	background: url(/media/recipient/img/icon_pen.svg) center center no-repeat;
	background-size: contain;
	content: "";
	z-index: 10;
}

.form button:before,
.onewig .link-button a:before{
	width: 1.8rem;
	height: 1.8rem;
	background: url(/media/recipient/img/icon_arrow_w.svg) center center no-repeat;
	background-size: contain;
}

.comment-input .submit button,
.form .submit button{ width: 48%;}

.comment-input .submit button:before,
.form .submit button:before{
	width: 2.4rem;
	height: 2.4rem;
}

.home-section .faq-search{ padding: 1.5em;}

.home-section .faq-search .txt{ font-size: 1.6rem;}

.home-section .faq-search form input{
	width: calc(100% - 7em);
	font-size: 1.6rem;
}

.home-section .faq-search button{
	padding: 0.4em 0 0.4em 1.8em;
	width: 7em;
}

.home-section .faq-search button:before{
	left: 0.5em;
	width: 2rem;
	height: 2rem;
}


/* talk-section TAB */


.about-aside{
	position: relative;
	margin: 3em auto 3em;
	padding: 1.5em;
	justify-content: flex-end;
}

.about-aside h2{
	position: relative;
	margin: 0 0 0.5em;
	width: calc(100% - 140px);
	color: #96c;
	font-size: 2.4rem;
	line-height: 1.6;
	text-align: left;
}

.about-aside .txt{
	position: relative;
	margin: 0;
	padding: 0;
	width: calc(100% - 140px);

	font-size: 1.6rem;
	line-height: 1.8;
	text-align: left;
}

.about-aside .photo{
	position: absolute;
	left: 1.5em;
	margin: 0;
	width: 120px;
}


.about-aside .photo-list{ width:  calc(100% - 140px);}



.point li{
	font-size: 1.6rem;
	line-height: 1.6;
}

.point li.small{
	font-size: 1.4rem;
	line-height: 1.6;
}


.talk-section .talk-box{
	position: relative;
	margin: 1em 0;
	padding: 0.5em 1em 1em 1.5em;
	display: block;
	overflow: hidden;
	border-radius: 0.6em;
	background-color: #eee;
}

.talk-section .talk-box:before,
.talk-section .talk-box:after{ left: 0; width: calc(100% - 2em);}

.talk-section .talk-box .inner{
	position: relative;
	padding: 0 1.5em 0 0.5em;
	height: 34em;
	display: block;
	overflow: auto;
}







/* form TAB */


.form-sub-title{
	position: relative;
	margin: 0 0 1em 0;
	padding: 0 0 0 3.4rem;
	color: #008eca;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.6;
}

.form-sub-title:before{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	margin: 0;
	padding: 0;
	width: 2.6rem;
	height: 2.6rem;
	display: block;
	background: url(/media/recipient/img/icon_camera.svg) center center no-repeat;
	background-size: contain;
	content: "";
}

.basic .form-sub-title{ color: #333;}

.basic .form-sub-title:before{
	background: url(/media/recipient/img/icon_form.svg) center center no-repeat;
	background-size: contain;
}

.sample-photo{ width: 90%;}

.sample-photo li{ width: 22%;}

.sample-notice{ width: 90%;}

.form-table th{
	width: 30%;
	display: table-cell;
}

.form-table td{
	width: 70%;
	display: table-cell;
	border-bottom: 1px dotted #ccc;
}

.form-photo label { font-size: 1.6rem;}

.form-photo label:hover { opacity: 0.7; transition: 0.3s ease-out;}
.form-photo label:after { font-size: 1.6rem;}
.form-photo .filename { font-size: 1.6rem;}

.confirm-photo li{
	float: left;
	margin: 0;
	padding: 0 1em 1.5em 1em;
	width: 33.3333333333333333333333333333333333333333%;
	display: block;
	overflow: hidden;
}


.form-table .input-block input{ margin: 0 0 1em; width: 80%; display: block;}

.form-table .input-block input:last-child{ margin: 0;}

.form-table .input-block.size-ss input{margin: 0 0.5em 0 0; width: 5em; display: inline-block;}

.form-table .name-dl{
	margin: 1.5em 0 0;
	width: 100%;
	font-size: 1.6rem;
	line-height: 1.4;
}

.form-table .name-dl dt{
	float: left;
	margin: 0;
	padding: 0.5em 0 0 1em;
	display: block;
	width: 4em;
}

.form-table .name-dl dd{
	float: left;
	margin: 0 0 1em 0;
	padding: 0;
	display: block;
	width: calc(50% - 4em);
}

.form-table .select-block{ width: 50%;}

.ymd-block .select-block{
	position: relative;
	display: inline-block;
}

.ymd-block .select-block{ margin-right: 0.5em; width: calc(100% - 3em);}




/* FAQ TAB */

.faq .faq-search{ padding: 2em;}

.mypage .inner-section .sub-title,
.faq .inner-section .q-title{ font-size: 2rem;}

.q-list li a{
	font-size: 1.8rem;
	line-height: 1.5;
}

.faq-section{
	margin: 3em auto;
	width: 94%;
	max-width: 800px;
	display: block;
}

.inner-section .answer .txt{
	font-size: 1.8rem;
	line-height: 1.6;
}


/* MYPAGE TAB */

.mypage .inner-basic{
	position: relative;
	margin: 1.5em;
	padding: 1.5em;
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
}

.mypage .inner-basic dl{ width: 60%;}


.mypage .inner-basic .presonal{
	position: relative;
	margin: 0;
	padding: 0;
	width: 40%;
	display: flex;
	align-items: center;
}

.mypage .inner-basic .presonal-icon{
	position: relative;
	margin: 0;
	padding: 0.5em;
	width: 10rem;
	height: 10rem;
	display: block;
	border-radius: 0.4em;
	background-color: #fff;
}

.mypage .inner-basic .presonal dt{
	position: relative;
	margin: 0;
	padding: 0;
	width: 10rem;
	display: block;
}

.mypage .inner-basic .presonal dt a{
	position: absolute;
	bottom: -2em;
	left: 0;
	right: 0;
	padding: 0.5em 0 0;
	display: block;
	font-size: 1.2rem;
	line-height: 1.4;
	text-align: center;
}

.mypage .inner-basic .presonal dd{
	position: relative;
	margin: 0;
	padding: 0;
	width: calc(100% - 12rem);
	display: block;
}

.mypage .inner-basic .presonal em{
	margin: 0;
	padding: 0.5rem 0 0;
	display: block;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.4;
}

}/* TAB */


@media screen and (min-width: 1000px), print {

/* HEADER PC */
header .mypage-menu a{
	padding: 0.5em 0 0.5em 1.4em;
	font-size: 1.4rem;
}


/* HOME PC */

.home-section .intro .button{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	padding: 0;
	width: 100%;
	height: 1.5em;
}

.home-section .intro .button a{
	position: absolute;
	top: 0;
	left: inherit;
	right: 0;
	bottom: 0;
	margin: auto;
	padding: 0.5em 0.3em 0 1em;
	width: 46%;
	max-width: 11.5em;
	height: inherit;
	display: inline-block;
	border-radius: 3em;
	background: #fff;
	color: #008eca;
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	white-space: nowrap;
}

.home-section .intro .button a:before {
	position: absolute;
	top: 0;
	left: 0.5em;
	right: inherit;
	bottom: 0;
	margin: auto 0;
	width: 1.2rem;
	height: 1.2rem;
	display: block;
	background: url(/media/recipient/img/icon_arrow.svg) center center no-repeat;
	background-size: contain;
	content: "";
}





/* FAQ PC */
.faq .faq-anchor li,
.onewig .onewig-anchor li{ width: 32%;}


}/* PC */


.mt-1{ margin-top: 1em;}
.mt-2{ margin-top: 2em;}
.mt-3{ margin-top: 3em;}
.mt-4{ margin-top: 4em;}

.mb-1{ margin-bottom: 1em;}
.mb-2{ margin-bottom: 2em;}
.mb-3{ margin-bottom: 3em;}
.mb-4{ margin-bottom: 4em;}


.ml-1{ margin-left: 1em;}
.ml-2{ margin-left: 2em;}
.ml-3{ margin-left: 3em;}
.ml-4{ margin-left: 4em;}

.mr-1{ margin-right: 1em;}
.mr-2{ margin-right: 2em;}
.mr-3{ margin-right: 3em;}
.mr-4{ margin-right: 4em;}

.pt-1{ padding-top: 1em;}
.pt-2{ padding-top: 2em;}
.pt-3{ padding-top: 3em;}
.pt-4{ padding-top: 4em;}

.pb-1{ padding-bottom: 1em;}
.pb-2{ padding-bottom: 2em;}
.pb-3{ padding-bottom: 3em;}
.pb-4{ padding-bottom: 4em;}

.pl-1{ padding-left: 1em;}
.pl-2{ padding-left: 2em;}
.pl-3{ padding-left: 3em;}
.pl-4{ padding-left: 4em;}

.pr-1{ padding-right: 1em;}
.pr-2{ padding-right: 2em;}
.pr-3{ padding-right: 3em;}
.pr-4{ padding-right: 4em;}


/* POPUP */

.mfp-fade.mfp-bg {
	opacity: 0;
	-webkit-transition: all 0.15s ease-out;
	-moz-transition: all 0.15s ease-out;
	transition: all 0.15s ease-out;
}
.mfp-fade.mfp-bg.mfp-ready { opacity: 0.8;}
.mfp-fade.mfp-bg.mfp-removing { opacity: 0;}

.mfp-fade.mfp-wrap .mfp-content {
	opacity: 0;
	-webkit-transition: all 0.15s ease-out;
	-moz-transition: all 0.15s ease-out;
	transition: all 0.15s ease-out;
}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1;}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0;}


@media screen and (min-width: 0\0) and (min-resolution: +72dpi) {
.swiper-button-next:after{ top: -25px; left: -2.5em;}
.swiper-button-prev:after{ top: -25px; right: -2.5em;}
}/* IE */


.user-name span{
  font-size: 1.4rem;
	font-weight: 600;
}

.step-slider .slide-05 .step-image:before {
	background: none;
}

.swiper-wrapper {
	display: flex;
	justify-content: center
}

@media screen and (min-width: 768px),print {
.contents-menu li a {
	font-size: 1.5rem;
}

.user-name span {
	font-size: 1.3rem;
}
}

.form .photo-thanks {
	position: relative;
	max-width: 80rem;
}
.form .photo-thanks .point li {
	list-style: none;
	margin: 0 0 1em 0.5em;
	font-weight: 400;
	line-height: 1.8;
}
.form .photo-thanks .point li a{
	font-weight: 400;
}
.form .photo-thanks:after {
	position: absolute;
	right: -5rem;
	top: -6rem;
	margin: auto;
	width: 100%;
	max-width: 37rem;
	height: 160%;
	display: block;
	background: url(/media/recipient/img/icon_admin.svg) center right no-repeat;
	background-size: contain;
	content: "";
	opacity: 0.2;
	z-index: -1;
}

/* alert-box */
.alert-box {
	background: #dff711;
	border-top: 1px solid #fff;
	padding: 2.2rem 0;
	margin: auto;
}

.alert-box .alert-txt {
	position: relative;
	text-align: center;
	line-height: 1.3;
	padding: 0 0 0 2.5rem ;
	color: #333;
	margin: 0 1.5rem;
	font-size: 1.6rem;
	font-weight: 800;
	align-items: center;
}

.alert-box .alert-txt::before {
	position: absolute;
	content: "";
	display: inline-block;
	width: 2rem;
	height: 2rem;
	margin: 0.1rem 0 0 -2.5rem;
	background: url(/media/recipient/img/icon_caution.svg) center center no-repeat;
	background-size: contain;
	margin-right: 0.3em;
	content: "";
	flex-shrink: 0;
}

.alert-box .alert-txt::after {
	content: "";
	display: inline-block;
	width: 1.2rem;
	height: 1.2rem;
	background: url(/media/recipient/img/icon_arrow_b.svg) center center no-repeat;
	background-size: contain;
	margin-left: 0.3em;
	content: "";
	flex-shrink: 0;
}

@media screen and (max-width: 768px),print {
.alert-box .alert-txt {
	text-align: left;
}
}