@charset "UTF-8";

/* #container_yp
---------------------------------------------------------------------------------------------------------*/
#home_yp #container_yp{ padding-bottom: 0; }
#container_yp .contents_yp{ max-width: 1320px; }

/* #about_yp
---------------------------------------------------------------------------------------------------------*/
#container_yp #about_yp{
	position: relative;
	width: 100%;
	max-width: 1600px;
	margin: -80px auto 30px;
}
#container_yp #about_yp .contents_yp{
	max-width: 1420px;
	margin-right: 0;
}
#container_yp #about_yp .bk{
	background-image: url(../down/img/about_pc.jpg);
	background-repeat: no-repeat;
	background-position: right bottom;
	padding-bottom: 60px;
}
#container_yp #about_yp .text{
	max-width: 460px;
	font-size: 0.95em;
	background-color: #FFF;
	-webkit-box-shadow: 0 8px 8px -3px #CCC;
	box-shadow: 0 8px 8px -3px #CCC;
	padding: 50px;
}
#container_yp #about_yp .text h3{
	font-size: 1.15em;
	font-weight: normal;
	line-height: 1.8em;
}
#container_yp #about_yp .text h3 strong{
	font-size: 1.1em;
	background: linear-gradient(transparent 60%, #FFEB60 0%);
	letter-spacing: 0.05em;
	margin: 0 0.25em;
}
#container_yp #about_yp .text p{
	letter-spacing: 0.1em;
	padding-top: 1em;
}
@media screen and (max-width: 1099px){
	#container_yp #about_yp{ margin-bottom: 0; }
	#container_yp #about_yp .text{
		max-width: 580px;
		padding: 40px;
	}
	#container_yp #about_yp .bk{ padding-bottom: 300px; }
}
@media screen and (max-width: 768px){
	#container_yp #about_yp{ margin-top: -50px; }
	#container_yp #about_yp .bk{ background-image: url(../down/img/about_sp.jpg); }
	#container_yp #about_yp .text{
		width: 90%;
		padding: 4%;
		margin: auto;
	}
}

/* #anchorNavi_yp
---------------------------------------------------------------------------------------------------------*/
#container_yp #anchorNavi_yp.contents_yp{
	text-align: center;
	padding: 20px;
}
#anchorNavi_yp li{
	display: inline-block;
	font-size: 1.1em;
	vertical-align: middle;
	margin: 0.5em 0.75em;
}
#anchorNavi_yp li a{
	display: block;
	border-bottom: solid 5px #EEE;
	padding: 0.5em 0.75em;
}
#anchorNavi_yp li a:hover{ border-bottom: solid 5px #FFEB60; }
@media screen and (max-width: 768px){ #container_yp #anchorNavi_yp{ display: none; } }

/* #secret_yp
---------------------------------------------------------------------------------------------------------*/
#container_yp #secret_yp{
	max-width: 1660px;
	padding-top: 50px;
	margin: auto;
}
#secret_yp .titleWrap_yp.contents_yp{ max-width: 1660px; }
#secret_yp .titleWrap_yp .titleBk_yp{
	background-image: url(../down/img/secret_bk.jpg);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: cover;
	padding: 60px 5%;
}
#secret_yp .titleWrap_yp .title_yp{
	max-width: 1280px;
	margin: auto;
}
#secret_yp .titleWrap_yp .text_yp{
	position: relative;
	max-width: 600px;
	text-align: center;
	background-color: #FFF;
	padding: 30px;
}
#secret_yp .titleWrap_yp .text_yp::before,
#secret_yp .titleWrap_yp .text_yp::after{
	content: "";
	width: 60px;
	height: 60px;
	position: absolute;
}
#secret_yp .titleWrap_yp .text_yp::before{
	border-left: solid thin #FFE200;
	border-top: solid thin #FFE200;
	top: 20px;
	left: 20px;
}
#secret_yp .titleWrap_yp .text_yp::after{
	border-right: solid thin #FFE200;
	border-bottom: solid thin #FFE200;
	bottom: 20px;
	right: 20px;
}
#secret_yp .titleWrap_yp .text_yp h3{
	font-size: 1.8em;
	font-weight: normal;
	line-height: 1.4em;
	letter-spacing: 0.05em;
	padding-bottom: 0.25em;
}
#secret_yp .secretBox_yp.contents_yp{
	max-width: 1300px;
	padding-top: 40px;
}
#secret_yp .secretBox_yp .left_yp{ float: left; }
#secret_yp .secretBox_yp .right_yp{ float: right; }
#secret_yp .secretBox_yp .text_yp{
	width: 43%;
	letter-spacing: 0.05em;
}
#secret_yp .secretBox_yp .text_yp .number_yp{
	text-align: center;
	overflow: hidden;
}
#secret_yp .secretBox_yp .text_yp .number_yp span{
	position: relative;
	display: inline-block;
	background-image: url(../down/img/secret_text.svg);
	background-repeat: no-repeat;
	background-position: center top;
	background-color: #FFF;
	padding: 25px 40px 0;
	margin: 0 2em;
}
#secret_yp .secretBox_yp .text_yp .number_yp span::before,
#secret_yp .secretBox_yp .text_yp .number_yp span::after{
	position: absolute;
	top: 70%;
	content: "";
	width: 400%;
	height: 5px;
	border-bottom: 3px double #DDD;
}
#secret_yp .secretBox_yp .text_yp .number_yp span::before{ right: 100%; }
#secret_yp .secretBox_yp .text_yp .number_yp span::after{ left: 100%; }
#secret_yp .secretBox_yp .text_yp h4{
	font-size: 1.4em;
	text-align: center;
	line-height: 1.6em;
	padding: 0.75em 0;
}
#secret_yp .secretBox_yp .text_yp p{
	font-size: 0.95em;
	line-height: 1.8em;
	padding: 0.5em;
}
#secret_yp .secretBox_yp .img_yp{
	width: 54%;
	text-align: center;
	padding-top: 1em;
}
#secret_yp .secretBox_yp .img_yp img{
	-webkit-box-shadow: 0 0 10px 0 #CCC;
	box-shadow: 0 0 10px 0 #CCC;
}
@media screen and (max-width: 768px){
	#secret_yp .titleWrap_yp.contents_yp{ padding: 0; }
	#secret_yp .titleWrap_yp .titleBk_yp{
		background-position: right bottom;
		background-size: 150% auto;
		padding: 0 0 35%;
	}
	#secret_yp .titleWrap_yp .title_yp{ max-width: 640px; }
	#secret_yp .titleWrap_yp .text_yp{ padding: 25px; }
	#secret_yp .titleWrap_yp .text_yp::before{
		border-left: solid 2px #FFE200;
		border-top: solid 2px #FFE200;
		top: 10px;
		left: 10px;
	}
	#secret_yp .titleWrap_yp .text_yp::after{
		border-right: solid 2px #FFE200;
		border-bottom: solid 2px #FFE200;
		bottom: 10px;
		right: 10px;
	}
	#secret_yp .titleWrap_yp .text_yp h3{ font-size: 1.5em; }
	#secret_yp .titleWrap_yp .text_yp h3 br{ display: none; }
	#secret_yp .secretBox_yp{ padding-top: 30px; }
	#secret_yp .secretBox_yp .left_yp,
	#secret_yp .secretBox_yp .right_yp{ float: none; }
	#secret_yp .secretBox_yp .text_yp,
	#secret_yp .secretBox_yp .img_yp{ width: 100%; }
	#secret_yp .secretBox_yp .text_yp h4{
		font-size: 1.3em;
		padding: 0.5em 0;
	}
	#secret_yp .secretBox_yp .text_yp p{
		font-size: 1em;
		padding: 0.25em;
	}
}

/* #works_yp
---------------------------------------------------------------------------------------------------------*/
#container_yp #works_yp{
	/* padding-top: 100px; */
	/* margin-top: -50px; */
}
#works_yp h2{
	text-align: center;
	font-weight: normal;
	margin-bottom: 60px;
}
#works_yp h2 span{
	display: block;
	background: url(../img/common/icon_line.gif) no-repeat center bottom;
	font-family: 'Marcellus', serif;
	font-size: 2.4em;
	letter-spacing: 0.1em;
	padding-bottom: 8px;
	margin-bottom: 15px;
}
#works_yp .slide_yp{
	float: left;
	width: 30.33%;
	border: solid thin #EEE;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	margin: 1.5%;
}
#works_yp .slide_yp .post-list{
	width: 100%;
	font-size: 13px;
	overflow: hidden;
}
#works_yp .slide_yp .post-list a{
	display: block;
	height: 100%;
	color: #666;
	background: #fff;
	border: 1px solid #eee;
	text-decoration: none;
	padding: 1em;
	min-height: 360px;
}
#works_yp .slide_yp .post-list .eyecatch{
	position: relative;
	max-height: 200px;
	background: #000;
	text-align: center;
	margin: -1em -1em 0.5em!important;
	overflow: hidden;
	height: 200px;
}
#works_yp .slide_yp .post-list .eyecatch .cat-name{
	position: absolute;
	top: 0;
	right: 0;
	color: #666;
	min-width: 7.5em;
	background: #FCEA6D;
	font-size: 0.88em;
	font-weight: bold;
	filter: alpha(opacity=90);
	-ms-filter: "alpha(opacity=90)";
	opacity: 0.9;
	padding: 0.1em 0.5em;
}
#works_yp .slide_yp .post-list .entry-content{ padding: 0; }
#works_yp .slide_yp .post-list .entry-content .entry-title{
	color: #444;
	font-size: 1.3em;
	margin-top: 0.5em;
	margin-bottom: 0.3em;
}
#works_yp .slide_yp .post-list .entry-content p{
	font-size: 11px;
	margin-bottom: 0.3em;
}
#works_yp .slide_yp .post-list .entry-content .byline .date{
	font-family: 'Ubuntu Condensed', sans-serif;
	font-weight: bold;
	color: #999;
}
#works_yp .slide_yp .post-list .entry-content .byline .date:before{
	font-family: "fontawesome";
	content: "\f101";
	font-size: .88em;
	margin-right: .3em;
	position: relative;
	top: -1px;
}

#works_yp .slide_yp .post-list .entry-content .byline .date:before{
	content: "\f274";
}





#works_yp .btn_yp a{
	font-family: 'Crimson Text', serif;
    display: block;
    max-width: 220px;
    color: #FFF;
    background-color: #4A4847 !important;
    text-align: center;
    letter-spacing: 0.05em;
    padding: 0.75em 0.5em !important;
    margin: 30px auto;
}
#works_yp .btn_yp a strong{
	background: url(../img/common/icon_arrow_yellow.png) no-repeat left 40%;
	padding-left: 40px;
}
@media screen and (max-width: 768px){
	#container_yp #works_yp{
		width: 90%;
	}
	#works_yp h2{ margin-bottom: 40px; }
	#works_yp h2 span{ font-size: 2em; }
	#works_yp .box_yp{
		float: none;
		width: 100%;
		border-bottom: solid thin #DDD;
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
	#works_yp .slide_yp{
		float: none;
		width: 100%;
		margin: 0;
	}
	#works_yp .bx-controls_yp{ display: block; }
	#works_yp .bx-wrapper_yp{
		position: relative;
		padding: 0;
		*zoom: 1;
		-ms-touch-action: pan-y;
		touch-action: pan-y;
	}
	#works_yp .bx-viewport_yp{ -webkit-transform: translatez(0); }
	#works_yp .bx-wrapper_yp .bx-prev_yp{
		left: -6.5%;
		background: url(../img/common/icon_control.png) no-repeat left top;
	}
	#works_yp .bx-wrapper_yp .bx-next_yp{
		right: -6.5%;
		background: url(../img/common/icon_control.png) no-repeat -19px top;
	}
	#works_yp .bx-wrapper_yp .bx-controls-direction_yp a{
		position: absolute;
		top: 45%;
		outline: 0;
		width: 19px;
		height: 32px;
		text-indent: -9999px;
		z-index: 0;
	}
	#works_yp .bx-wrapper_yp .bx-controls-direction_yp a.disabled{ display: none; }
}

/* #reason_yp
---------------------------------------------------------------------------------------------------------*/
#reason_yp{
	max-width: 1660px;
	padding-top: 50px;
	margin: auto;
}
#reason_yp .titleWrap_yp.contents_yp{ max-width: 1660px; }
#reason_yp .titleWrap_yp .titleBk_yp{
	background-image: url(../down/img/reason_bk.jpg);
	background-repeat: no-repeat;
	background-position: right center;
	background-size: cover;
	padding: 60px 5%;
}
#reason_yp .titleWrap_yp .title_yp{
	max-width: 1280px;
	margin: auto;
}
#reason_yp .titleWrap_yp .text_yp{
	position: relative;
	max-width: 600px;
	text-align: center;
	background-color: #FFF;
	padding: 80px 30px;
}
#reason_yp .titleWrap_yp .text_yp::before,
#reason_yp .titleWrap_yp .text_yp::after{
	content: "";
	width: 60px;
	height: 60px;
	position: absolute;
}
#reason_yp .titleWrap_yp .text_yp::before{
	border-left: solid thin #FFE200;
	border-top: solid thin #FFE200;
	top: 20px;
	left: 20px;
}
#reason_yp .titleWrap_yp .text_yp::after{
	border-right: solid thin #FFE200;
	border-bottom: solid thin #FFE200;
	bottom: 20px;
	right: 20px;
}
#reason_yp .titleWrap_yp .text_yp h3{
	font-size: 1.8em;
	font-weight: normal;
	line-height: 1.4em;
	letter-spacing: 0.05em;
	padding-bottom: 0.25em;
}
#reason_yp .reasonBox_yp{
	float: left;
	width: 45%;
	font-size: 0.95em;
	letter-spacing: 0.1em;
	padding: 2.5%;
	margin-top: -10%;
	clear: both;
}
#reason_yp .reasonBox_yp:nth-child(even){ float: right; }
#reason_yp .reasonBox_yp.reason01{ margin-top: 0; }
#reason_yp .reasonBox_yp h4{
	min-height: 85px;
	font-size: 1.4em;
	line-height: 1.6em;
	background-repeat: no-repeat;
	background-position: right bottom;
	padding-right: 75px;
	margin-bottom: 1em;
}
#reason_yp .reasonBox_yp h4:after{
	display: block;
	content: "";
	width: 95%;
	height: 1px;
	background-color: #EDE9E2;
	margin-top: 0.5em;
}
#reason_yp .reasonBox_yp.reason01 h4{ background-image: url(../down/img/reason01.svg); }
#reason_yp .reasonBox_yp.reason02 h4{ background-image: url(../down/img/reason02.svg); }
#reason_yp .reasonBox_yp.reason03 h4{ background-image: url(../down/img/reason03.svg); }
#reason_yp .reasonBox_yp.reason04 h4{ background-image: url(../down/img/reason04.svg); }
#reason_yp .reasonBox_yp.reason05 h4{ background-image: url(../down/img/reason05.svg); }
@media screen and (max-width: 768px){
	#reason_yp{ padding-top: 0; }
	#reason_yp .titleWrap_yp.contents_yp{ padding: 0; }
	#reason_yp .titleWrap_yp .titleBk_yp{
		background-position: right bottom;
		background-size: 150% auto;
		padding: 0 0 35%;
	}
	#reason_yp .titleWrap_yp .title_yp{ max-width: 640px; }
	#reason_yp .titleWrap_yp .text_yp{ padding: 50px 25px; }
	#reason_yp .titleWrap_yp .text_yp::before{
		border-left: solid 2px #FFE200;
		border-top: solid 2px #FFE200;
		top: 10px;
		left: 10px;
	}
	#reason_yp .titleWrap_yp .text_yp::after{
		border-right: solid 2px #FFE200;
		border-bottom: solid 2px #FFE200;
		bottom: 10px;
		right: 10px;
	}
	#reason_yp .titleWrap_yp .text_yp h3{ font-size: 1.5em; }
	#reason_yp .titleWrap_yp .text_yp h3 br{ display: none; }
	
	#reason_yp .reasonBox_yp{
		float: none;
		width: 96%;
		padding: 20px 2%;
		margin-top: 0;
	}
	#reason_yp .reasonBox_yp:nth-child(even){ float: none; }
	#reason_yp .reasonBox_yp h4{
		min-height: 70px;
		font-size: 1.3em;
		background-size: auto 70px;
		padding-right: 65px;
	}
}

/* #flow_yp
---------------------------------------------------------------------------------------------------------*/
#flow_yp h2{
	text-align: center;
	font-weight: normal;
	margin-bottom: 60px;
}
#flow_yp h2 span{
	display: block;
	background: url(../img/common/icon_line.gif) no-repeat center bottom;
	font-family: 'Marcellus', serif;
	font-size: 2.4em;
	letter-spacing: 0.1em;
	padding-bottom: 8px;
	margin-bottom: 15px;
}
#flow_yp .step_yp{
	float: left;
	width: 18%;
	margin: 1%;
}
#flow_yp .step_yp h3{
	font-size: 1.1em;
	font-weight: normal;
	text-align: center;
	line-height: 1.4em;
	letter-spacing: 0.1em;
	padding-top: 1em;
	padding-bottom: 1em;
}
#flow_yp .step_yp p{
	font-family : YuGothic, '游ゴシック', sans-serif, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic";
	font-size: 0.95em;
}
@media screen and (max-width: 768px){
	#flow_yp h2{ margin-bottom: 30px; }
	#flow_yp h2 span{ font-size: 2em; }
	#flow_yp .step_yp{
		float: none;
		width: 100%;
		border-bottom: solid thin #DDD;
		padding-bottom: 20px;
		margin: 0 0 20px;
	}
	#flow_yp .step_yp img{
		float: left;
		max-width: 150px;
		height: auto;
	}
	#flow_yp .step_yp .text_yp{ margin-left: 170px; }
	#flow_yp .step_yp h3{
		text-align: left;
		padding-top: 0;
	}
	#flow_yp .step_yp h3 br{ display: none; }
	#flow_yp .step_yp:last-child{
		border-bottom: none;
		padding-bottom: 0;
		margin: 0;
	}
}
@media screen and (max-width: 400px){
	#flow_yp .step_yp img{ max-width: 120px; }
	#flow_yp .step_yp .text_yp{ margin-left: 130px; }
}

/* #price_yp
---------------------------------------------------------------------------------------------------------*/
#price_yp{
	width: 100%;
	background-image: url(../img/home/price_bk.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: 60px 0 150px;
	margin: 120px auto 0;
}
#price_yp h2{
	text-align: center;
	font-weight: normal;
	margin-bottom: 40px;
}
#price_yp h2 span{
	display: block;
	background: url(../img/common/icon_line.gif) no-repeat center bottom;
	font-family: 'Marcellus', serif;
	font-size: 2.4em;
	letter-spacing: 0.1em;
	padding-bottom: 8px;
	margin-bottom: 15px;
}
#price_yp .box_yp{
	float: left;
	width: 48%;
	background-color: rgba(255, 255, 255, 0.9);
	-webkit-box-shadow: 0 0 10px 0 #e3e7de;
	box-shadow: 0 0 10px 0 #e3e7de;
	padding: 20px 30px;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	height: auto !important;
}
#price_yp .box_yp:nth-child(even){ float: right; }
#price_yp .box_yp h3{
	font-weight: normal;
	background-image: url(../down/img/price_icon_down.svg);
	background-repeat: no-repeat;
	background-position: right center;
	cursor: pointer;
	padding-right: 30px;
}
#price_yp .box_yp h3.open_yp{ background-image: url(../down/img/price_icon_up.svg); }
#price_yp .box_yp h3 span{
	font-family: 'Crimson Text', serif;
	font-size: 1.6em;
	font-style: italic;
	font-weight: bold;
	padding-right: 0.1em;
}
#price_yp .box_yp .dropdown_yp{ display: none; }
#price_yp .box_yp ul{ padding-top: 10px; }
#price_yp .box_yp li{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	background: url(../img/common/icon_list.png) no-repeat left 0.5em;
	border-bottom: solid thin #EEE;
	padding-left: 20px;
	padding-bottom: 10px;
	margin-top: 10px;
}
#price_yp .box_yp li:last-child{
	border-bottom: none;
	padding-bottom: 0;
}
#price_yp .box_yp li:: after{
	content: '';
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	-webkit-box-ordinal-group: 2;
	-ms-flex-order: 1;
	order: 1;
}
#price_yp .box_yp li .price_yp{
	font-style: italic;
	-webkit-box-ordinal-group: 3;
	-ms-flex-order: 2;
	order: 2;
}
#price_yp .btn_yp a{
	font-family: 'Crimson Text', serif;
	display: block;
	max-width: 220px;
	color: #FFF;
	background-color: #4A4847;
	text-align: center;
	letter-spacing: 0.05em;
	padding: 0.75em 0.5em;
	margin: 30px auto;
}
#price_yp .btn_yp a strong{
	background: url(../img/common/icon_arrow_yellow.png) no-repeat left 40%;
	padding-left: 40px;
}
@media screen and (max-width: 768px){
	#price_yp{
		background-position: right center;
		padding: 40px 0;
		margin: 60px auto 0;
	}
	#price_yp .contents_yp{
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}
	#price_yp h2 span{ font-size: 2em; }
	#price_yp .box_yp{
		float: none;
		width: 100%;
		padding: 20px;
		margin-bottom: 20px;
	}
	#price_yp .box_yp:nth-child(even){ float: none; }
	#price_yp .box_yp h3 span{ font-size: 1.4em; }
}

/* print.css
---------------------------------------------------------------------------------------------------------*/
@media print{
	#container_yp .fadein_yp{
		position: inherit;
		filter: alpha(opacity=100) !important;
		-moz-opacity: 1 !important;
		opacity: 1 !important;
	}
}

/* offer */
#line_cp img{
	max-width: 720px;
}
#offer_button a{
	background: #ffeb60;
    padding: 16px 0;
    width: 480px;
    display: inline-block;
    border-radius: 40px;
    margin-top: 2rem;
}
#offer_area{
	margin-bottom: 2rem;
}
@media screen and (max-width: 768px){
	#line_cp img{
		width: 600px;
		max-width: 95%;
	}
	#offer_button a{
		width: 95%;
	}
	#container_yp{
		width: 100% !important;
	}
}