/*
YUI 3.18.1 (build f7e7bcb)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/

html {
	color: #000;
	background: #FFF
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

fieldset, img {
	border: 0
}

address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal
}

ol, ul {
	list-style: none;
}

caption, th {
	text-align: left
}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal
}

q:before, q:after {
	content: ''
}

abbr, acronym {
	border: 0;
	font-variant: normal
}

sup {
	vertical-align: text-top
}

sub {
	vertical-align: text-bottom
}

input, textarea, select {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	*font-size: 100%
}

legend {
	color: #000
}

#yui3-css-stamp.cssreset {
	display: none
}

html, body {
	height: 100%;
}

body {
	font-size: 14px;
	-webkit-text-size-adjust: 100%;
	font-family: "Noto Sans Japanese", Meiryo, arial, clean, verdana, 'Hiragino Kaku Gothic Pro', "ＭＳ Ｐゴシック", Osaka, sans-serif;
	text-align: center;
	color: #1d1d1d;
}

a {
	text-decoration: none;
	color: #001a54;
	line-height: 1;
	opacity: 1;
}

a, a:hover {
	-webkit-transition: 0.7s;
	-moz-transition: 0.7s;
	-o-transition: 0.7s;
	transition: 0.7s;
}

a img:hover {
	-moz-opacity: 0.75;
	opacity: 0.75;
}

a:hover {
	opacity: 0.5;
}


/*====================================================
LAYOUT
====================================================*/

#wrapper {
	width: 100%;
	height: 100%;
	position: relative;
	margin: 0 auto;
}

.w1100 {
	width: 1100px;
	margin: 0 auto;
}

.w1020 {
	width: 1020px;
	margin: 0 auto;
}

.w960 {
	width: 960px;
	margin: 0 auto;
}

.w720 {
	width: 720px;
	margin: 0 auto;
}

.inside {
	width: 100%;
}

/*====================================================
HEADER
====================================================*/
#header {
	padding: 18px 0 20px 0;
}

#header .w960 {
	position: relative;
}

#header h1 {
	position: absolute;
	right: 80px;
	color: #666666;
	font-size: 12px;
}

#header .hdnavi {
	position: absolute;
	right: 10px;
	font-size: 12px;
}

#header #hd_l {
	float: left;
	margin-bottom: 20px;
}

#header #hd_r {
	position: absolute;
	right: 0;
	top: 25px;
}

#header #hd_r ul li {
	float: left;
	font-size: 10px;
	height: 60px;
	margin-left: 10px;
}

#header #hd_r ul li.phone {
	font-weight: 600;
	line-height: 1.8;
	font-size: 11px;
	padding-top: 0.5rem;
	text-align: right;
}

#header #hd_r ul li.phone .freedial {
	font-size: 28px;
	background: url("../img/ico/freedial.png") no-repeat left 12px;
	line-height: 20px;
	padding-left: 40px;
}

#header #hd_r ul li.phone .freedial,
#navigation .freedial {
	font-size: 21px;
	background: url("../img/ico/freedial.png") no-repeat left 6px;
	line-height: 20px;
	padding-left: 40px;
}

#header #hd_r ul li.phone .big {
	line-height: 21px;
}

#header #hd_r ul li.phone a {
	line-height: 21px;
	color: #000;
}

#header #hd_r ul li.phone .br {
	font-weight: 300;
}

a.tel:hover {
	opacity: 1;
	cursor: default;
}

#header #hd_r ul li.form_sp a,
#header #hd_r ul li.form a,
#header #hd_r ul li.simu a,
#header #hd_r ul li.mypg a {
	display: block;
}

#header #hd_r ul li.mypg {
	border: 1px solid #c8c8c8;
	box-sizing: border-box;
	width: 70px;
	border-radius: 5px;
}

#header #hd_r ul li.mypg a {
	background: url("../img/ico/mypage2.png") no-repeat top center;
	padding-top: 40px;
	font-size: 10px;
}

#header #hd_r ul li.simu {
	border-radius: 5px;
	background: #c49958;
	width: 210px;
}

#header #hd_r ul li.simu a {
	padding: 15px 0 15px 40px;
	font-size: 14px;
	color: #ffffff;
	background: url("../img/ico/simulation.png") no-repeat 15px 15px;
}

#header #hd_r ul li.form {
	width: 100px;
}

#header #hd_r ul li.form_sp a,
#header #hd_r ul li.form a {
	font-size: 14px;
	color: #1d1d1d;
	background: #f0f0f0;
	border-radius: 5px;
	padding-top: 23px;
	height: 37px;
}

#header #hd_r ul li.form_sp a {
	height: 30px;
	padding-top: 18px;
	background: #c49958;
	color: #fff;
	border-radius: 5px;
	font-size: 11px;
	width: 55px;
	border: 1px solid #ddd;
}


#header .logo,
#header .ship {
	float: left;
}

#header .logo {
	margin-right: 17px;
}

#header .ship {
	margin-top: 18px;
	border: 4px solid #ea426a;
	box-sizing: border-box;
	width: 83px;
	height: 60px;
	position: relative;
	color: #ea426a;
	font-weight: 900;
	font-size: 16px;
	line-height: 1.2;
	padding-top: 5px;
}

#header .ship .island {
	color: #fff;
	line-height: 1;
	background: #ea426a;
	height: 45px;
	width: 45px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	right: -30px;
	top: -30px;
	font-size: 14px;
}

.br {
	display: block;
}

/*====================================================
NAVIGATION
====================================================*/
#navigation {
	clear: both;
}

#navigation ul {
	background: url("../img/all/ln.png") no-repeat right;
	width: 100%;
	height: 64px;
	display: block;
}

#navigation ul li {
	float: left;
	height: 64px;
	width: 151px;
	background: url("../img/all/ln.png") no-repeat left;
}

#navigation ul li a {
	display: block;
	padding-top: 42px;
}

#navigation ul li.home {
	width: 45px;
}

#navigation ul li.home a {
	padding-top: 32px;
}

#navigation ul li {
	position: relative;
}

#navigation ul li.nav1 a.feature {
	padding-top: 36px;
	background: url("../img/ico/simple_water.png") no-repeat top center;
}

#navigation ul li.nav2 a {
	background: url("../img/ico/voice.png") no-repeat top center;
}

#navigation ul li.nav3 a {
	background: url("../img/ico/mypage.png") no-repeat top center;
}

#navigation ul li.nav4 {
	width: 160px;
}

#navigation ul li.nav4 a {
	background: url("../img/ico/price.png") no-repeat top center;
	letter-spacing: -1px;
}

#navigation ul li.nav5 a {
	background: url("../img/ico/campaign.png") no-repeat top center;
}

#navigation ul li.nav6 a {
	background: url("../img/ico/faq.png") no-repeat top center;
}

#slide {
	width: 100%;
	overflow: hidden;
}

.slick-slide img {
	max-width: 100vw;
}

#slide .pc {
	display: block;
}

#slide .sp {
	display: none;
}

#navigation ul li.nav1 ul {
	display: none;
	z-index: 1000;
	position: absolute;
	top: 65px;
	width: 220px;
	background: none;
}

#navigation ul li.nav1 ul li {
	width: auto;
	height: auto;
	background: none;
}

#navigation ul li.nav1 ul li a {
	padding: 0.5rem;
	border: none;
	background: #c4eff6;
	display: block;
	width: 200px;
	text-align: left;
}

#navigation ul li.nav1 ul li a:hover {
	background: #92f0ff;
	opacity: 1;
}

.sideLink {
	z-index: 1000;
	position: fixed;
	right: 0;
	top: 40%;
}

.sideLink li a {
	position: relative;
	display: block;
	padding: 10px 10px 20px;
	border-radius: 5px;
	background-color: #45a97f;
	box-shadow: 3px 3px 10px 0.4px rgba(30, 38, 30, 0.1);
	text-decoration: none;
	color: #fff;
	text-align: center;
	font-weight: 600;
}

.sideLink li img {
	width: auto;
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto 10px;
	border-radius: 5px;
}

.sideLink li a::after {
	content: "";
	position: absolute;
	right: 8px;
	bottom: 8px;
	background: url(../img/top/icn_arrow_white.svg) right bottom / contain no-repeat;
	width: 11px;
	height: 11px;
}

.sideLink li a p {
	width: 80px;
}

@media screen and (max-width: 1020px) {
	.sideLink {
		display: none;
	}
}


/*====================================================
MAIN
====================================================*/
#main {}

.section1 {
	padding: 50px 0 60px 0;
}

.section1_index {
	padding: 30px 0 50px 0 !important;
}

.section1 h2 {
	background: url("../img/all/h2ln.png") no-repeat center center;
	font-size: 22px;
	line-height: 22px;
	margin-bottom: 35px;
}

.circles {
	width: 322px;
	margin: auto;
	margin-bottom: 23px;
}

.circles li {
	float: left;
	border: 1px solid #007fc4;
	background: #e5f2f9;
	height: 100px;
	width: 100px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	color: #007fc4;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 600;
	letter-spacing: -1px;
	text-align: center;
	line-height: 1.3;
	margin-left: 8px;
}

.circles li:first-child {
	margin-left: 0;
}

.circles li:nth-child(2) {
	border: 1px solid #ea426a;
	background: #fff;
	color: #ea426a;
}

.btn1 {
	width: 214px;
	height: 60px;
	margin: 0 auto;
}

.btn2 {
	width: 540px;
	height: 60px;
	margin: 0 auto;
}

.btn3 {
	width: 320px;
	line-height: 1;
}

.btn4 {
	width: 90%;
	height: 60px;
	margin: 0 auto;
}

.btn4 a,
.btn3 a,
.btn2 a,
.btn1 button,
.btn1 a {
	color: #fff;
	display: block;
	line-height: 60px;
	font-size: 18px;
	text-align: center;
	background: #cfe500;
	background: -moz-linear-gradient(left, #cfe500 0%, #00c5d5 100%);
	background: -webkit-linear-gradient(left, #cfe500 0%, #00c5d5 100%);
	background: linear-gradient(to right, #cfe500 0%, #00c5d5 100%);
	border: none;
	cursor: pointer;
}

.btn1 button#calculate {
	width: 100%;
}

.btn4 a span,
.btn3 a span,
.btn2 a span,
.btn1 a span {
	background: url("../img/ico/arrow3.png") no-repeat left center;
	padding-left: 25px;
}

.btn4 a {
	background: #c49958;
}

.section2 h2 {



	color: #00c5d5;
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 10px;
}

.section2 h2 .underline {
	background: rgba(0, 0, 0, 0) linear-gradient(transparent 65%, #fff800 0%) repeat scroll 0 0;
}

#topbox1 {
	background: url("../img/top/topbox1.jpg") no-repeat center center;
	height: 500px;
}

#topbox2 {
	background: url("../img/top/topbox2.jpg") no-repeat center center;
	height: 500px;
}

#topbox3 {
	background: url("../img/top/topbox3.jpg") no-repeat center center;
	height: 560px;
}

#factory.paraxify,
#topbox1.paraxify,
#topbox2.paraxify,
#topbox3.paraxify {
	background-attachment: fixed;
	background-position: center center;
	background-size: cover;
}

#topbox1 .whitebox,
#topbox2 .whitebox,
#topbox3 .whitebox {
	width: 500px;
	background: #fff;
	box-sizing: border-box;
	line-height: 1.7;
	text-align: left;
	position: relative;
}

#topbox1 .whitebox {
	float: left;
	margin-top: 100px;
	padding: 60px 50px 60px 30px;
}

#topbox2 .whitebox {
	float: right;
	margin-top: 50px;
	padding: 30px 50px 30px 30px;
}

#topbox3 .whitebox {
	float: left;
	margin-top: 70px;
	padding: 50px 50px 50px 30px;
}

#topbox3 .btn1,
#topbox2 .btn1 {
	position: absolute;
	bottom: -25px;
	left: 0;
	right: 0;
}

.listbox {
	margin-top: 15px;
}

.listbox li {
	width: 48%;
	float: left;
	margin-left: 4%;
	box-sizing: border-box;
	border: 1px solid #007fc4;
	padding: 5px 0;
	color: #007fc4;
	text-align: center;
	margin-bottom: 10px;
}

.listbox li:nth-child(2n+1) {
	margin-left: 0;
}

.listbox li:first-child,
.listbox li:last-child {
	background: #e5f2f9;
}

#living {
	background: url("../img/top/living.jpg");
}

#living p.detail {
	font-size: 16px;
	margin-bottom: 30px;
	color: #001a54;
}

.flowbox div,
.livebox div {
	width: 225px;
	float: left;
	margin-left: 20px;
}

.flowbox div:first-child,
.livebox div:first-child {
	margin-left: 0;
}

.flowbox .img,
.livebox .img {
	display: block;
	margin: 0;
	z-index: 1;
}

.flowbox .img img,
.livebox .img img {
	width: 100%;
	height: auto;
}

.livebox .txt {
	margin: 0;
	padding: 0 20px 28px 18px;
	box-sizing: border-box;
	text-align: left;
	background: #fff;
	font-size: 13px;
	color: #001a54;
	min-height: 190px;
	position: relative;
}

.livebox .txt h3 {
	background: url("../img/top/living_bg1.png") no-repeat top left;
	padding-top: 17px;
	color: #00c5d5;
	font-weight: 600;
	font-size: 16px;
	letter-spacing: -1px;
	line-height: 1.3;
	margin-bottom: 10px;
}

.livebox #livebox4 .txt h3,
.livebox #livebox2 .txt h3 {
	background: url("../img/top/living_bg2.png") no-repeat top left;
	color: #007fc4;
}

.livebox a.arrow {
	position: absolute;
	bottom: 20px;
	left: 18px;
	background: url("../img/ico/arrow.png") no-repeat left;
	padding-left: 20px;
	color: #1d1d1d;
}


#voice .img {
	margin-bottom: 25px;
}

#flow {
	background: #f5f5f3;
}

#news {
	background: none;
	text-align: center;
}

#news .tbl_news {
	margin: 20px 100px;
	width: calc(100% - 200px) !important;
}

.flowbox {
	margin-bottom: 30px;
}

.flowbox h3 {
	background: url("../img/top/flow_ttl_bg.png") no-repeat;
	display: block;
	width: 182px;
	height: 30px;
	line-height: 30px;
	color: #001a54;
	padding-left: 10px;
	margin: 0 auto;
	box-sizing: border-box;
	position: relative;
	top: -15px;
	z-index: 10;
}

.flowbox h3 span {
	padding-left: 20px;
}

.flowbox .txt {
	margin: 0;
	text-align: left;
	color: #001a54;
	padding: 0 8px 0 6px;
	box-sizing: border-box;
}

.section3 {
	padding: 70px 0 20px 0;
	box-sizing: border-box;
}

#factory {
	height: 302px;
	background: url("../img/top/factory_bg2.png") no-repeat;
	/*background-position:80% center;*/
}

#factory_l {
	float: left;
	width: 250px;
	margin-left: 60px;
	margin-top: 30px;
}

#factory_l img {
	width: 100%;
}

#factory_r {
	float: left;
	width: 600px;
	margin-left: 40px;
	text-align: left;
}

#factory_r h2 {
	background: url("../img/ico/tree.png") no-repeat left;
	padding-left: 49px;
	font-size: 22px;
	color: #00c5d5;
	letter-spacing: 3px;
	font-weight: 600;
	line-height: 29px;
	margin: 25px 0 15px 0;
}

#factory_r p {
	color: #001a54;
	margin-bottom: 25px;
}



.section4 {
	padding: 30px 0;
}

#contact {
	background: url("../img/top/blue_bg.png");
}

.contactbox {
	background: #fff;
	padding: 20px 30px;
	box-sizing: border-box;

}

.contact_l {
	float: left;
	background: url("../img/top/ln2.png") no-repeat right;
	min-height: 85px;
	padding: 30px 19px 0 0;
}

.contact_r {
	float: right;
	margin-top: 10px;
}

.contactbox ul {
	float: right;
	padding-left: 10px;
}

.contactbox ul li {
	float: left;
}

.contactbox ul li.phone {
	font-weight: 600;
	line-height: 1.4;
	text-align: right;
	margin: 0 20px 0 0;
	color: #001a54;
	font-size: 12px;
}

.contactbox ul li.phone .big {
	font-size: 30px;
	letter-spacing: 1px;
}

.contactbox ul li.form {
	width: 210px;
}

.contactbox ul li.form a {
	font-size: 16px;
	display: block;
	font-weight: bold;
	color: #ffffff;
	background: #c49958;
	border-radius: 5px;
	/*height:80px;*/
	line-height: 1.4em;
	padding: 18px 0;
}

.contactbox ul li.form_2 {
	width: 210px;
	padding-top: 0;
	margin-top: 0;
}

.form_2box {
	width: 210px;
	padding-top: 0;
	margin-top: 0;
}

.contactbox ul li.form_2 a {
	font-size: 16px;
	display: block;
	font-weight: bold;
	color: #ffffff;
	background: #c49958;
	border-radius: 5px;
	/*height:80px;*/
	line-height: 1.1em;
	padding: 15px 0;
	/* margin-top: 5px; */
	margin-bottom: 5px;
}



/*====================================================
PAGE
====================================================*/
#page h2 {
	color: #001a54;
	font-size: 30px;
	font-weight: bold;
	background: url("../img/page/ttl_bg.jpg") center center;
	background-size: cover;
	padding: 50px 0;
}

#page #contents {
	background: url("../img/page/page_bg.png") center center;
}

.breadcrumb {
	padding: 9px 0;
}

.breadcrumb li {
	float: left;
	background: url("../img/ico/bc.png") no-repeat right center;
	padding-right: 15px;
	margin-right: 7px;
	font-size: 10px;
	color: #040000;
}

.breadcrumb li a {
	font-size: 10px;
	text-decoration: underline;
	color: #040000;
}

.breadcrumb li:last-child {
	background: none;
}

#contentsbox {
	background: #fff;
	border-radius: 10px;
	padding: 30px;
	width: 900px;
}

#page p a,
.faqbox a {
	color: #00b1f2;
}

#page h3 {
	color: #00c5d5;
	font-size: 22px;
	background: url("../img/all/h2ln.png") no-repeat center center;
	margin-bottom: 20px;
}

#page h3.largetxt {
	background: url("../img/all/h2ln_large.png") no-repeat center center;
}

#page h3.nobg {
	background: none;
}

#page .page_detail {
	line-height: 1.8;
	width: 90%;
	margin: 0 auto 40px auto;
}

#page h4 {
	background: #00c5d5;
	font-size: 20px;
	color: #fff;
	padding: 0.5rem;
	border-radius: 5px;
	margin-bottom: 40px;
}

#page h5 {
	font-size: 20px;
	color: #007fc4;
	padding: 0 0 10px 0;
	text-align: left;
	background: url("../img/all/h5bg.png") repeat-x bottom;
	margin-bottom: 20px;
}

#page .pickup h5 {
	background: none;
	color: #da40af;
	text-align: center;
	padding: 0.5rem 0 0.5rem 0;
	margin: 0;
	font-weight: bold;
}

.col2 {
	margin-bottom: 40px;
}

.col2 .col2_l {
	float: left;
	width: 35.7%;
}

.col2 .col2_r {
	float: right;
	width: 60.8%;
}

/** 180327 add **/

.col2inr {
	margin-bottom: 40px;
}

.col2inr .col2inr_l {
	float: left;
	width: 60.8%;
}

.col2inr .col2inr_r {
	float: right;
	width: 35.7%;
}

/** 180327 add end **/

#page .txl {
	text-align: left;
	line-height: 1.8;
}

#page .list_water li {
	background: url("../img/ico/water.png") no-repeat left;
	text-align: left;
	padding: 0.3rem 0 0.3rem 1.5rem;
	margin-bottom: 0.8rem;
}

#page h6 {
	font-weight: 600;
	color: #00c5d5;
	background: url("../img/ico/water.png") no-repeat left;
	text-align: left;
	padding: 0.3rem 0 0.3rem 1.8rem;
	margin-bottom: 0.8rem;
	font-size: 22px;
}

.tbl2,
.tbl1,
.tbl3 {
	width: 100%;
	border-bottom: 1px solid #d1e2e3;
	border-right: 1px solid #d1e2e3;
}

.tbl2 th,
.tbl2 td,
.tbl1 th,
.tbl1 td,
.tbl3 th,
.tbl3 td {
	border-top: 1px solid #d1e2e3;
	border-left: 1px solid #d1e2e3;
	padding: 10px;
	text-align: left;
}

.tbl1 th {
	width: 30%;
	color: #001a54;
	background: #f0fafb;
}

.tbl3 th {
	width: 60%;
	color: #001a54;
	background: #f0fafb;
}

.tbl2 th {
	width: 20%;
	background: #f0fafb;
}

.tbl2 td.price {
	width: 15%;
}

.tbl2 caption,
.tbl1 caption,
.tbl3 caption {
	background: #c9f1f5;
	padding: 1rem;
	text-align: center;
	color: #037079;
	font-size: 16px;
	border-top: 1px solid #afe2e6;
	width: 100%;
	box-sizing: border-box;
}

.tbl1 label,
.tbl3 label {
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	margin-bottom: 0.5rem;
}

.tbl2.area {
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

.tbl2.area th,
.tbl2.area td {
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}

.tbl2 .area1 {
	color: #4a7000;
	background: #b4e67f;
}

.tbl2 .area2 {
	color: #024cd1;
	background: #8cdbff;
}

.tbl2 .area3 {
	color: #4e1c72;
	background: #bf9bf3;
}

.tbl2 .area4 {
	color: #a30a40;
	background: #fda1db;
}

.tbl2 .area5 {
	color: #914700;
	background: #ffa35f;
}

.tbl2 .area6 {
	color: #928307;
	background: #ffff7c;
}

.tbl2 .area7 {
	color: #05653b;
	background: #5ae197;
}

.pickup {
	border-radius: 5px;
	border: 3px solid #00c5d5;
	background: #fff;
	padding: 0.5rem 1rem;
}

.pickup .txt {
	margin: 10px 0;
}

.pickup dt {
	font-size: 21px;
	font-weight: bold;
	font-family: 'Josefin Sans', sans-serif;
	color: #00c5d5;
	text-align: center;
	padding: 0.2rem 0.5rem 0.4rem 0;
}

.pickup dd {
	text-align: left;
}

.pickup dd .img {
	width: 60%;
	margin: 0 auto 0.5rem auto;
}

.pickup dd .img02 {
	width: auto;
	margin: 0 auto 0.5rem auto;
}

.pickup dd .img03 {
	width: 100%;
	margin: 0 auto 0.5rem auto;
}

.stepbox {}

.voicelist li,
.stepbox li {
	width: 22%;
	float: left;
	margin-left: 4%;
	box-sizing: border-box;
	margin-bottom: 1rem;
}

.voicelist li:nth-child(4n+1),
.stepbox li:nth-child(4n+1) {
	clear: left;
	float: left;
	margin-left: 0;
}

.voicelist li img {
	cursor: pointer;
}

.stepbox li ul li {
	width: 100%;
	float: none;
	margin: 0 0 0.5rem 0;
}

.stepbox li ul li:first-child {
	vertical-align: top;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: bold;
	color: #00c5d5;
	font-size: 24px;
	background: url("../img/ico/arrow6.png") no-repeat right top;
}

.stepbox li:nth-child(4n) ul li:first-child {
	background: none;
}

.stepbox li ul li:first-child span {
	display: block;
	font-size: 18px;
	font-weight: 100;
}

.stepbox li ul li:first-child .brsp {
	padding-left: 1rem;
}

.stepbox li ul li img {
	border-radius: 5px;
}

/** 180327 add **/

.stepbox02 {
	display: flex;
	justify-content: space-between;
}

.stepbox02 li {
	width: 28%;
	position: relative;
}

.stepbox02 li:first-child, .stepbox02 li:nth-child(2) {
	margin-right: 40px;
}

.stepbox02 li::after {
	position: absolute;
	content: ' ';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 0 20px 20px;
	border-color: transparent transparent transparent #00c3d5;
	right: -20%;
	top: calc(30% - 10px);
}

.stepbox02 li:last-child::after {
	content: none;
}

.stepbox02 li ul li::after {
	content: none;
}

.stepbox02 li ul li {
	width: 100%;
}

.stepbox02 li ul li:first-child, .stepbox02 li ul li:nth-child(2) {
	padding-right: 0;
	margin-bottom: 10px;
}

.stepbox02 li ul li img {
	width: 100%;
}

/****/

.col3 div {
	width: 30%;
	float: left;
	position: relative;
}

.col3_c,
.col3_r {
	margin-left: 5%;
}

.col3 div ul li:first-child {
	font-weight: bold;
	color: #000;
	font-size: 21px;
	padding-bottom: 10px;
}

.col3 .img {
	border: 1px solid #acdbdf;
	box-sizing: border-box;
}

.col3 .col3_c ul li,
.col3 .col3_r ul li {
	position: relative;
}

.col3 .col3_c ul li .plus,
.col3 .col3_r ul li .plus {
	position: absolute;
	left: -23%;
	top: 35%;
}

.col3 .col3_c .plus img,
.col3 .col3_r .plus img {
	width: 40px;
	height: 40px;
}

.ytbox {
	background: #eee;
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}

.ytbox iframe {
	width: 100%;
	border: 0;
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}

.flow_arrow {
	padding-bottom: 60px;
	background: url("../img/ico/arrow5.png") no-repeat bottom;
	margin-bottom: 30px;
}

.voicelist {}

.voicelist ul li .img {
	display: block;
	margin-bottom: 0.5rem;
}

.voicelist ul li {
	text-align: left;
}

ul.pager {
	margin: 10px 0 30px;
	text-align: center;
	width: 100%;
	box-sizing: border-box;
}

ul.pager li {
	display: inline;
	line-height: 1.5em;
}

ul.pager li a {
	padding: 3px 8px 3px 8px;
	background: #fff;
	color: #00c5d5;
	margin-left: 3px;
	text-decoration: none;
	border: 1px solid #00c5d5;
	box-sizing: border-box;
}

ul.pager li a:hover {
	background-color: #00c5d5;
	color: #fff;
}

ul.pager li.active a {
	background-color: #00c5d5;
	color: #fff;
}

ul.pager li.disabled {
	display: none;
}

.reason_img img {
	width: 50%;
	height: auto;
}

.reason_txt {
	display: block;
	padding-bottom: 1rem;
}

.reason_txt p {
	text-align: left;
	margin-bottom: 1rem;
	line-height: 1.8;
}

.faqbox {
	margin-bottom: 4rem;
}

.faqbox dd,
.faqbox dt {
	padding: 1rem;
	text-align: left;
}

.faqbox dt {
	color: #2b78a2;
	font-weight: 600;
	background: #ebf5fa;
}

.faqbox dd {
	margin-bottom: 1rem;
}

.faqbox dd span,
.faqbox dt span {
	font-weight: bold;
	font-size: 125%;
	padding-right: 0.5rem;
}

.faqbox dd span {
	color: #dc4583;
}

.pt1 {
	padding-top: 1rem;
}

.faqbox .ytbox {
	margin-top: 1rem;
}

.totalbox {
	line-height: 1;
}

.totalbox .totals {
	font-size: 36px;
	font-weight: bold;
	width: 200px;
	padding: 0 0.6rem;
	border-bottom: 3px double #ddd;
}

.mypagebox {
	margin-bottom: 2rem;
}

.mypage_img {
	width: 20%;
	float: left;
}

.popup {
	width: 0;
	height: 0;
}

.notes {
	margin: 20px;
	text-align: left;
}

.notes ul {
	list-style: disc;
}

.notes ul li {
	margin: 5px 10px;
}

.plan02 ol,
.pickup ol {
	counter-reset: my-counter;
	list-style: none;

	padding: 0;
	text-align: left;
}

.plan02 ol {
	float: right;
	margin: 40px 160px 40px 0;
}


.plan02 li,
.pickup li {
	margin-bottom: 10px;
	padding-left: 30px;
	position: relative;
}

.plan02 li:before,
.pickup li:before {
	content: counter(my-counter);
	counter-increment: my-counter;
	background-color: #00c5d5;
	color: #fff;
	display: block;
	float: left;
	line-height: 22px;
	margin-left: -30px;
	text-align: center;
	height: 22px;
	width: 22px;
	border-radius: 50%;
}

.campaign01 {
	color: #ea426a;
	font-size: 110%;
	text-decoration: line-through;
}

.campaign02 {
	color: #ea426a;
	font-size: 180%;
	font-weight: bold;
}

.pick_up {
	border-radius: 10px;
	background: #da40af;
	color: #fff;
	padding: 2px 6px 0px 10px;
	font-size: 90%;
	margin-top: -3px;
}

.plan01 {
	width: 720px;
	padding: 20px 90px;
	background: url(../img/page/plan_bg01.jpg) repeat-x left bottom #d3e7f8;
}

.tbl_plan table {
	margin: 0 !important;
}

.tbl_plan table th {
	background: url(../img/page/plan_img06.png) no-repeat center;
	width: 130px;
	height: 70px;
	text-align: center;
	vertical-align: middle;
	color: #3F76CC;
	font-size: 110%;
	font-weight: bold;
}

.tbl_plan table td {
	text-align: left;
	vertical-align: middle;
	padding-left: 20px;
}

.campaign03 {
	font-size: 180%;
	font-weight: bold;
}

.campaign04 {
	border-bottom: solid #3F76CC 3px;
}

.tbl_f {
	margin-top: 10px;
	background-color: #fff;
	padding: 15px;
	border-radius: 5px;
}

.tbl_f table {
	margin: 0 !important;
}

.tbl_f p {
	color: #000;
}

.plan02 {
	width: 840px;
	padding: 10px 30px 30px;
	background-color: #8fc322;
	overflow: hidden;
}

.plan02 .flame {
	padding: 20px;
	border-radius: 10px;
	overflow: hidden;
	background: url(../img/page/plan_img03.png) right bottom no-repeat #fff;
}

.plan02 h6 {
	margin-left: 30px;
}

h6.p02 {
	color: #fff !important;
	margin-left: 0;
}

.plan03 {
	margin: 20px;
}

.plan03 .txt {
	float: right;
	width: 610px;
	text-align: left;
	color: #fff;
}

.plan04 {
	width: 860px;
	padding: 40px 20px;
	text-align: center;
	background: url(../img/page/plan_img05.png) no-repeat center #d3e7f8;
}

.news td.detail {
	border-left: none;
	text-align: right;
}

.news a.arrow {
	bottom: 20px;
	left: 18px;
	background: url("../img/ico/arrow.png") no-repeat left;
	padding-left: 20px;
	color: #1d1d1d;
}


/** 180327 **/

.tour_img2col {
	display: flex;
	justify-content: space-between;
}

.tour_img2col li {
	width: 48%;
}

/** 180327 end **/

/** 20250527**/
.col_r {
	color: red;
}

/** 20250527 end **/

/** 20250807 **/
article {
	text-align: left;
	line-height: 2rem;
	margin: 30px;
}

article h2 {
	font-size: 18px;
	color: #1ba3ed;
	text-align: center;
}

#page article h3 {
	text-align: left;
	color: #00c5d5;
	font-size: 22px;
	background-image: none;
	margin-bottom: 20px;
}

article ol {
	list-style-type: none;
	padding-left: 2em;
}

article ul {
	padding-top: 5px;
	padding-left: 2em;
	list-style-type: disc;
}

article ul.noStyle {
	padding-left: 0;
}

article ul.noStyle li {
	list-style-type: none;
	padding-left: 3em;
	text-indent: -2em;
}

/* space
============================================================ */
.mt10 {
	margin-top: 10px !important;
}

.mt15 {
	margin-top: 15px !important;
}

.mt20 {
	margin-top: 20px !important;
}

.mt25 {
	margin-top: 25px !important;
}

.mt30 {
	margin-top: 30px !important;
}

.mt40 {
	margin-top: 40px !important;
}

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

	/* for SP */
	.mt10 {
		margin-top: 5px !important;
	}

	.mt15 {
		margin-top: 7px !important;
	}

	.mt20 {
		margin-top: 10px !important;
	}

	.mt25 {
		margin-top: 12px !important;
	}

	.mt30 {
		margin-top: 15px !important;
	}

	.mt40 {
		margin-top: 20px !important;
	}
}

/** 20250807 end **/

/*====================================================
FOOTER
====================================================*/
#footer {
	color: #fff;
	text-align: center;
	background: #001a54;
	padding: 50px 0;
}

#footer a {
	color: #fff;
}

#footer #ft_l {
	width: 470px;
	float: left;
}

#footer #ft_r {
	width: 410px;
	float: right;
}

#footer #ft_l li,
#footer #ft_r .ft_l3 li {
	float: left;
}

#footer #ft_l .ft_l1,
#footer #ft_l .ft_l2,
#footer #ft_r .ft_l3 {
	clear: both;
}

#footer #ft_l .ft_l1 {
	margin-bottom: 20px;
}

#footer #ft_l .ft_l2 {
	margin-bottom: 30px;
}

#footer #ft_r .ft_l3 {
	margin-bottom: 5px;
}

#footer #ft_l .ft_l1 li {
	margin-left: 40px;
}

#footer #ft_l .ft_l1 li:first-child a {
	padding-top: 30px;
}

#footer #ft_l .ft_l1 li:last-child {
	/* margin-left: 32px; */
	margin-left: 15px;
}

#footer #ft_l .ft_l2 li:first-child {
	text-align: right;
}

#footer #ft_l .ft_l2 li {
	font-size: 10px;
	line-height: 1;
	letter-spacing: 1px;
}

#footer #ft_l .ft_l2 li .br {
	padding-bottom: 4px;
}

#footer #ft_l .ft_l2 li .big {
	font-size: 26px;
	font-weight: 600;
}

#footer #ft_l .ft_l2 li:last-child {
	padding: 8px 0;
	border-top: 1px dotted #fff;
	border-bottom: 1px dotted #fff;
	margin-left: 1.5%;
	text-align: left;
}

#footer #ft_l .ft_l2 li:last-child span {
	font-size: 12px;
	padding-bottom: 4px;
}

#footer #ft_r .ft_l3 li {
	margin-left: 10px;
	height: 60px;
}

#footer #ft_r .ft_l3 li:first-child {
	margin-left: 0;
}

#footer #ft_l .ft_l1 li a,
#footer #ft_r .ft_l3 li.form a,
#footer #ft_r .ft_l3 li.simu a,
#footer #ft_r .ft_l3 li.mypg a {
	display: block;
}

#footer #ft_r .ft_l3 li.mypg {
	box-sizing: border-box;
	width: 70px;
	border-radius: 5px;
	background: #fff;
}

#footer #ft_r .ft_l3 li.mypg a {
	background: url("../img/ico/mypage2.png") no-repeat top center;
	padding-top: 40px;
	font-size: 10px;
	color: #001a54;
}

#footer #ft_r .ft_l3 li.simu {
	background: #c49958;
	border-radius: 5px;
	width: 220px;
}

#footer #ft_r .ft_l3 li.simu a {
	padding: 15px 0 15px 40px;
	font-size: 14px;
	color: #ffffff;
	background: url("../img/ico/simulation.png") no-repeat 15px 15px;
}

#footer #ft_r .ft_l3 li.form {
	width: 100px;
}

#footer #ft_r .ft_l3 li.form a {
	font-size: 14px;
	background: #f0f0f0;
	color: #1d1d1d;
	border-radius: 5px;
	padding-top: 23px;
	height: 37px;
}


#footer #ft_r .ft_r2,
#footer #ft_r .ft_r1 {
	width: 180px;
	float: left;
	margin-bottom: 30px;
}

#footer #ft_r .ft_r2 {
	margin-left: 20px;
}

#footer #ft_r .ft_r2 li,
#footer #ft_r .ft_r1 li,
#footer #ft_r .ft_r2 li a,
#footer #ft_r .ft_r1 li a {
	font-size: 12px;
	text-align: left;
	margin-bottom: 5px;
}

#footer #ft_r .copyright {
	text-align: left;
	clear: both;
}

#footer .ship {
	margin-top: 18px;
	border: 4px solid #ea426a;
	box-sizing: border-box;
	width: 240px;
	height: 100px;
	position: relative;
	color: #ea426a;
	font-weight: 900;
	font-size: 22px;
	line-height: 1.2;
	padding-top: 15px;
	background: #fff;
}

#footer .ship .island {
	color: #fff;
	line-height: 1;
	background: #ea426a;
	height: 67px;
	width: 67px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	right: -35px;
	top: -35px;
}

#footer .ship a {
	display: block;
	font-size: 16px;
	color: #ea426a;
	background: #f9c6d2;
	font-weight: 400;
	width: 92%;
	margin: 10px auto 0 auto;
	line-height: 34px;
}

#footer .ship a span {
	line-height: 34px;
	background: url("../img/ico/arrow4.png") no-repeat left;
	padding-left: 25px;
}

#footer .ft_l4 {
	margin-top: 30px;
	text-align: left;
}

/*====================================================
IMG100%
====================================================*/
#voice .img img,
.mypage_img img,
.pickup dd .img img,
.pickup dd .img03 img,
.voicelist ul li img,
.col3 div ul li img,
.stepbox li img,
.col2 .col2_l img,
.col2inr .col2inr_r img,
.slider img,
.img100,
.tour_img2col li img {
	width: 100%;
	height: auto;
}

/*====================================================
CLEARFIX
====================================================*/
.mypagebox:after,
.voicelist:after,
.col3:after,
.stepbox:after,
.col2:after,
.col2inr:after,
.breadcrumb:after,
.contactbox:after,
#factory:after,
.flowbox:after,
.livebox:after,
.listbox:after,
.circles:after,
.section2:after,
.tour_img2col:after,
#footer #ft_l .ft_l1:after,
#footer #ft_l .ft_l2:after,
#footer #ft_r .ft_l3:after,
#header:after,
#wrapper:after,
#contents:after,
#footer:after,
#navigation:after,
#header:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
	font-size: 0;
}

/*====================================================
BASE
====================================================*/
.tbl1 .ctr,
.tbl3 .ctr,
.ctr {
	text-align: center;
}

.en {
	font-family: 'Josefin Sans', sans-serif;
	color: #aaa;
}

.big {
	font-size: 150%;
}

.blue {
	color: #00c5d5;
}

.red {
	color: #ea426a;
}

.bold,
strong {
	font-weight: bold;
}

.txtlt {
	text-align: left;
}

img {
	vertical-align: bottom;
}

.mb1 {
	margin-bottom: 1rem;
}

.mb2 {
	margin-bottom: 2rem;
}

.mb3 {
	margin-bottom: 3rem;
}

.mb4 {
	margin-bottom: 4rem;
}

.mt55 {
	margin-top: 55px;
}

.pt4 {
	padding-top: 4rem;
}

#navigation ul li.nav_sp1,
#navigation ul li.nav_sp2,
#navigation ul li.nav_sp3,
#navigation ul li.nav_sp4,
#header #hd_r ul li.form_sp,
.popup,
.att1,
.att2,
#navigation ul li.home .sp,
.voice_sp,
.spmn,
.pickup_sp,
.sp {
	display: none;
}

.voice_pc,
.pickup_pc {
	display: block;
}

.strike {
	text-decoration: line-through;
}

.img_r {
	text-align: right;
	padding-top: 20px;
}

.plan02_img {
	float: left;
	margin-left: 30px;
}

.fl_r {
	float: right;
	margin-right: 30px;
}

.clear {
	clear: both;
}

.fl_l2 {
	float: left;
	margin-top: 20px;
}

.form2_flame {
	margin-top: 10px;
}

iframe.kiyaku {
	border: none;
	width: 100%;
	height: 3100px;
}

.frame {
	overflow: hidden;
	overflow-x: hidden;
	overflow-y: hidden;
	height: 100%;
	width: 100%;
	position: relative;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;
}

/*====================================================
media query for smartphone, tablet
====================================================*/

@media screen and (max-width: 1180px) {
	.w1100 {
		width: 90%;
	}

	.sp {
		display: none;
	}
}

@media screen and (max-width: 1020px) {
	.w960 {
		width: 90%;
	}

	#navigation,
	#navigation ul li.home .pc,
	#hd_r .simu,
	#hd_r .phone,
	#header h1,
	.hdnavi {
		display: none;
	}

	#navigation ul li.home .sp {
		display: block;
	}

	#navigation ul li.nav_sp1,
	#navigation ul li.nav_sp2,
	#navigation ul li.nav_sp3,
	#navigation ul,
	#navigation ul li.home,
	#navigation ul li.nav1,
	#navigation ul li.nav2,
	#navigation ul li.nav3,
	#navigation ul li.nav4,
	#navigation ul li.nav5,
	#navigation ul li.nav6 {
		width: 100%;
		background: #f0f0f0;
	}

	#navigation ul li.nav_sp4 {
		width: 100%;
		background: #eaf7f0;
	}

	#navigation ul li {
		height: auto;
		border-bottom: 1px dotted #8c8c8c;
	}

	#navigation ul li a {
		text-align: left;
		padding-top: 0;
		line-height: 50px;
	}

	#navigation ul li.home a {
		background: url("../img/ico/sp/home.png") no-repeat;
	}

	#navigation ul li.nav1 a.feature {
		background: url("../img/ico/sp/nav1.png") no-repeat;
	}

	#navigation ul li.nav2 a {
		background: url("../img/ico/sp/nav2.png") no-repeat;
	}

	#navigation ul li.nav3 a {
		background: url("../img/ico/sp/nav3.png") no-repeat;
	}

	#navigation ul li.nav4 a {
		background: url("../img/ico/sp/nav4.png") no-repeat;
	}

	#navigation ul li.nav5 a {
		background: url("../img/ico/sp/nav5.png") no-repeat;
	}

	#navigation ul li.nav6 a {
		background: url("../img/ico/sp/nav6.png") no-repeat;
	}

	#navigation ul li.nav1 a.feature,
	#navigation ul li.home a,
	#navigation ul li.nav1 a,
	#navigation ul li.nav2 a,
	#navigation ul li.nav3 a,
	#navigation ul li.nav4 a,
	#navigation ul li.nav5 a,
	#navigation ul li.nav6 a {
		background-position: 0 50%;
		padding: 0 0 0 4rem;
		min-height: 36px;
	}

	#navigation ul li.nav1 ul {
		position: static;
	}

	#navigation ul li.nav1 ul,
	#navigation ul li.nav1 ul li,
	#navigation ul li.nav1 ul li a {
		width: 100%;
		display: block;
	}

	#navigation ul li.nav1 ul li a {
		padding: 0 0 0 1.5rem;
		box-sizing: border-box;
	}

	#navigation ul li a .br {
		display: inline;
	}

	#navigation ul li.nav_sp1,
	#navigation ul li.nav_sp2,
	#navigation ul li.nav_sp3 {
		display: block;
		background: #fef8ec;
	}

	#navigation ul li.nav_sp4 {
		display: block;
		background: #eaf7f0;
	}

	#navigation ul li.nav_sp1 a,
	#navigation ul li.nav_sp2 a,
	#navigation ul li.nav_sp3 a,
	#navigation ul li.nav_sp4 a {
		padding: 0 0 0 1.5rem;
	}

	#header .spmn {
		display: block;
	}

	#header .spmn a {
		display: block;
		width: 60px;
		height: 60px;
		color: #fff;
		background: url("../img/all/spmn.png") no-repeat center center;
		position: relative;
		border-radius: 5px;
	}

	#header .spmn.active a {
		background: url("../img/all/spmn_close.png") no-repeat center center;
		z-index: 2;
		border-radius: 5px;
	}

	#header .spmn a span {
		position: absolute;
		bottom: 8px;
		left: 0;
		right: 0;
	}

	#voice img,
	.bnr img {
		width: 100%;
		height: auto;
	}

	#factory {
		height: auto;
	}

	.contact_l,
	.contact_r,
	#factory_l,
	#factory_r {
		width: auto;
		float: none;
		margin: 0;
	}

	.contact_l {
		background: none;
		border-bottom: 1px dotted #333;
		margin-bottom: 20px;
	}

	.flowbox div,
	.livebox div {
		margin-bottom: 20px;
	}

	#flowbox3,
	#livebox3 {
		clear: left;
		margin-left: 0;
	}

	#footer #ft_l,
	#footer #ft_r {
		float: none;
		margin: 0 auto 20px auto;
	}

	.stepbox li ul li:first-child {
		background: url("../img/ico/arrow6s.png") no-repeat right top;
	}

	.pickup_sp {
		display: block;
	}

	.pickup_pc {
		display: none;
	}

	#contentsbox {
		width: 100%;
		box-sizing: border-box;
	}
}

@media screen and (max-width: 900px) {
	.col3 div ul li:first-child {
		font-size: 18px;
	}

	.w720 {
		width: 95%;
	}

	.stepbox li ul li:first-child span {
		font-size: 16px;
	}

	.plan01 {
		width: calc(100% - 20px);
		/*width: 100%;*/
		padding: 20px 10px;
	}

	/*.tbl_f{
	background-color: #fff;
	padding: 5px;
	border-radius: 5px;
}*/
	.tbl_f table {
		margin: 0 !important;
	}

	.pickup_sp {
		display: block;
	}

	.pickup_pc {
		display: none;
	}

	.plan02 {
		width: calc(100% - 20px);
		padding: 10px;
		background-color: #8fc322;
	}

	.plan02 .flame {
		padding: 10px;
		border-radius: 10px;
		overflow: hidden;
		background-image: none;
	}

	.plan02 h6 {
		margin-left: 0;
	}

	.plan02 ol {
		float: left;
		margin: 20px 0 0;
	}

	.plan03 .txt {
		width: 100%;
	}

	.plan04 {
		width: calc(100% - 40px);
		padding: 20px;
		text-align: center;
		background-image: none;
		background-size: 100%;
	}

	.plan04 p {
		background-color: #fff;
		padding: 10px;
		border-radius: 20px;
	}

	.plan02_img {
		width: 100%;
		text-align: center;
		margin: 0;

	}

	.mt55 {
		margin-top: 12px;
	}

	.tour_img2col {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.tour_img2col li {
		width: 100%;
	}
}

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

	.flowbox #flowbox1,
	.flowbox #flowbox2,
	.flowbox #flowbox3,
	.flowbox #flowbox4,
	.livebox #livebox1,
	.livebox #livebox2,
	.livebox #livebox3,
	.livebox #livebox4 {
		width: 48%;
		margin-left: 0;
	}

	.flowbox #flowbox2,
	.flowbox #flowbox4,
	.livebox #livebox2,
	.livebox #livebox4 {
		margin-left: 4%;
	}

	.flowbox .txt,
	.flowbox .img,
	.livebox .txt,
	.livebox .img {
		width: 100%;
	}

	.voice_pc,
	.pc {
		display: none;
	}

	.voice_sp {
		display: block;
	}

	.contactbox ul li.form {
		width: auto;
	}

	.contactbox ul li.form a {
		line-height: 1.5;
		padding: 15px 20px 0 20px;
		height: 65px;
	}

	.contactbox ul li.form_2 {
		width: auto;
		display: block;
	}

	.contactbox ul li.form_2 a {
		line-height: 1.5;
		padding: 15px 20px 0 20px;
		height: 65px;
	}

	.contactbox ul li.form a span.brsp {
		display: block;
	}

	.col3 div ul li:first-child {
		font-size: 21px;
	}

	.col3_c,
	.col3_r,
	.col3 div {
		float: none;
		width: 100%;
		margin: 0 0 5rem 0;
	}

	.mb_none {
		margin-bottom: 0 !important;
	}

	.col3 .col3_c ul li .plus,
	.col3 .col3_r ul li .plus {
		left: 0;
		right: 0;
		top: -6rem;
	}

	.voicelist li,
	.stepbox li {
		width: 48%;
		float: left;
		margin-left: 4%;
	}

	.voicelist li:nth-child(2n+1),
	.stepbox li:nth-child(2n+1) {
		clear: left;
		float: left;
		margin-left: 0;
	}

	.stepbox li ul li {
		margin: 0 0 0.5rem 0;
	}

	#slide .pc {
		display: none;
	}

	#slide .sp {
		display: block;
	}

	.pickup dd .img03 {
		width: 100%;
	}

	/** 180327 add **/
	.stepbox02 {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.stepbox02 li {
		width: 100%;
		position: relative;
	}

	.stepbox02 li:first-child, .stepbox02 li:nth-child(2) {
		margin-right: 0;
		margin-bottom: 80px;
	}

	.stepbox02 li::after {
		position: absolute;
		content: ' ';
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 30px 30px 0 30px;
		border-color: #00c3d5 transparent transparent transparent;
		right: calc(50% - 30px);
		top: auto;
		bottom: -55px;
	}

	.stepbox02 li:last-child::after {
		content: none;
	}

	.stepbox02 li ul li::after {
		content: none;
	}

	.stepbox02 li ul li {
		width: 100%;
		margin-bottom: 0;
	}

	.stepbox02 li ul li:first-child, .stepbox02 li ul li:nth-child(2) {
		padding-right: 0;
	}

	.stepbox02 li ul li img {
		width: 60%;
	}

	#page h3.largetxt {
		background-image: none;
	}

	/****/

}

@media screen and (max-width: 600px) {
	#hd_r .form {
		display: none;
	}

	#header #hd_r {
		top: 0;
	}

	.btn2 {
		width: 100%;
	}

	#topbox1,
	#topbox2,
	#topbox3 {
		height: auto;
		padding: 50px 0;
	}

	.section1 {
		background: url("../img/top/section1_bg.png") no-repeat left bottom;
	}

	#factory.paraxify,
	#topbox1.paraxify,
	#topbox2.paraxify,
	#topbox3.paraxify {
		background-attachment: scroll;
	}

	#topbox1 .whitebox,
	#topbox2 .whitebox,
	#topbox3 .whitebox {
		width: 95%;
		float: none;
		margin: 0 auto;
		padding: 30px;
	}

	#page .col2_l,
	#page .col2_r {
		width: 100%;
		float: none;
	}

	#page .col2_l {
		margin-bottom: 20px;
	}

	#page .col2inr_l,
	#page .col2inr_r {
		width: 100%;
		float: none;
	}

	#page .col2inr_l {
		margin-bottom: 20px;
	}

	.reason_img img {
		width: 100%;
	}

	.mypage_img {
		width: 30%;
	}

	#header .logo {
		width: 80px;
	}

	#header .logo img {
		width: 100%;
		height: auto;
	}

	#header .spmn a {
		width: 50px;
		height: 50px;
	}

	#header #hd_r ul li.mypg {
		width: 60px;
		height: 50px;
	}

	#header #hd_r ul li.mypg a {
		padding-top: 36px;
		background: url("../img/ico/mypage2.png") no-repeat 16px -3px;
	}

	#header #hd_r ul li.form_sp {
		display: block;
	}

	#header .ship {
		font-size: 12px;
		border: 2px solid #ea426a;
		width: 63px;
		height: 42px;
		margin-top: 10px;
	}

	#header .ship .island {
		font-size: 12px;
		width: 35px;
		height: 35px;
		right: -25px;
		top: -25px;
	}

	.tbl3 th,
	.tbl3 td,
	.tbl_sp th,
	.tbl_sp td {
		width: 100% !important;
		display: block;
		box-sizing: border-box;
	}

	.tbl_plan table th {
		padding-top: 20px;
	}

	.tbl_plan table td {
		padding-bottom: 40px;
	}

	.news td.detail {
		border-left: 1px solid #d1e2e3;
		border-top: none;
		text-align: right;
	}

	.btn4 a {
		padding: 0.2rem 0.5rem;
		line-height: 1.8;
	}

	#news .tbl_news {
		margin: 20px 0;
		width: 100% !important;
	}

	table.table01 {

		border-left: 1px solid #d1e2e3;
	}

	table.table01 thead {
		display: none;
	}

	table.table01 tbody th,
	table.table01 tbody td {
		display: block;
		width: calc(100% - 20px);
		border-left: none;
	}

	/*table.table01 tbody td.check_p {
	border-bottom: 1px dashed #d1e2e3;
	}*/
	table.table01 tbody td.step {
		border-top: 1px dashed #d1e2e3;
	}

	table.table01 tbody td:before {
		content: attr(label);
		/*float: left;*/
		clear: both;
		font-weight: bold;
		color: #00c5d5;
	}

	table.table01 tbody td p {
		/*padding-left:1em;*/
	}

	.sp {
		display: inherit;
	}

	.fl_l2 {
		margin-top: 0;
	}

	.form2_flame {}
}

@media screen and (max-width: 580px) {
	#contentsbox {
		padding: 10px;
	}

	#footer #ft_l .ft_l1 li {
		margin: 0;
		float: none;
	}

	#footer #ft_l .ft_l1 li:first-child {

		margin-bottom: 50px;
	}

	#footer .ship {
		width: 94%;
	}

	#footer #ft_l .ft_l2 li:first-child {
		padding-bottom: 15px;
	}

	#footer #ft_l .ft_l1 li:last-child {
		margin-left: 0;
	}

	#footer #ft_l .ft_l2 li:last-child,
	#footer #ft_l .ft_l2 li:first-child {
		text-align: center;
	}

	.listbox {
		margin-bottom: 1rem;
	}

	.listbox li {
		width: 100%;
		float: none;
		margin-left: 0;
	}

	.listbox li:first-child,
	.listbox li:last-child {
		background: #fff;
	}

	.listbox li:nth-child(2n+1) {
		background: #e5f2f9;
	}

	.img_r img {
		width: 100%;
	}
}

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

	#footer #ft_l,
	#footer #ft_r {
		width: auto;
		float: none;
	}

	.contactbox ul {
		/* float:none; */
		display: block;
		/* color:  wheat; */
		width: 100%;
	}

	.contact_l {
		min-height: auto;
		padding: 0 0 15px 0;
	}

	.contact_l img {
		width: 100%;
	}

	.contactbox ul li {
		float: none;
		width: 100%;
		text-align: center;
	}

	.contactbox ul li.phone {
		margin-bottom: 15px;
		text-align: center;
	}

	.contactbox ul li.form a {
		height: auto;
		padding: 15px;
	}

	.contactbox ul li.form a span.brsp {
		display: inline;
	}

	#footer #ft_r .ft_l3 li.form,
	#footer #ft_r .ft_l3 li.simu,
	#footer #ft_r .ft_l3 li.mypg,
	#footer #ft_r .ft_l3 li {
		float: none;
		width: 100%;
		margin: 0 0 15px 0;
		height: auto;
	}

	.contactbox ul li.form_2 a {
		height: auto;
		padding: 15px;
	}

	.contactbox ul li.form_2 a span.brsp {
		display: inline;
	}

	#footer #ft_r .ft_l3 li.form_2,
	#footer #ft_r .ft_l3 li.simu,
	#footer #ft_r .ft_l3 li.mypg,
	#footer #ft_r .ft_l3 li {
		float: none;
		width: 100%;
		margin: 0 0 15px 0;
		height: auto;
	}

	#footer #ft_r .ft_l3 li.form a,
	#footer #ft_r .ft_l3 li.simu a,
	#footer #ft_r .ft_l3 li.mypg a {
		font-size: 16px;
		padding: 18px 0;
		height: auto;
	}

	#footer #ft_r .ft_l3 li.form_2 a,
	#footer #ft_r .ft_l3 li.simu a,
	#footer #ft_r .ft_l3 li.mypg a {
		font-size: 16px;
		padding: 18px 0;
		height: auto;
	}

	#footer #ft_r .ft_l3 li.simu .br {
		display: inline;
	}

	#footer #ft_r .ft_l3 li.mypg a {
		background-position: 30% 10%;
	}

	#footer #ft_r .ft_l3 li.simu a {
		background-position: 5% 50%;
	}
}

@media screen and (max-width: 480px) {
	#header #hd_r {
		top: 0;
	}

	#header {
		padding-bottom: 0;
	}

	#navigation {
		margin-bottom: 20px;
	}

	.circles {
		width: 247px;
	}

	.circles li {
		height: 75px;
		width: 75px;
		font-size: 12px;
	}

	.flowbox div,
	.flowbox #flowbox1,
	.flowbox #flowbox2,
	.flowbox #flowbox3,
	.flowbox #flowbox4,
	.livebox div,
	.livebox #livebox1,
	.livebox #livebox2,
	.livebox #livebox3,
	.livebox #livebox4 {
		width: 100%;
		margin: 0 0 20px 0;
		float: none;
	}

	#footer #ft_l .ft_l2 li {
		float: none;
	}

	#footer #ft_r .ft_r2,
	#footer #ft_r .ft_r1 {
		width: 100%;
		float: none;
		margin: 0;
	}

	#footer #ft_r .ft_r2 {
		margin-bottom: 20px;
	}

	#footer #ft_r li {
		width: 100%;
		border-bottom: 1px dotted #56668c;
	}

	#footer #ft_r .ft_r1 li:first-child {
		border-top: 1px dotted #56668c;
	}

	#footer #ft_r .ft_r2 li a,
	#footer #ft_r .ft_r1 li a {
		display: block;
		padding: 0.5rem 0.5rem 0.5rem 0;
		font-size: 16px;
	}

	#footer #ft_r .copyright {
		text-align: center;
	}

	.btn2 a {
		line-height: 1.3;
		padding: 0.5rem;
	}

	.stepbox li ul li:first-child span {
		font-size: 14px;
	}

	.mypage_img {
		width: 40%;
	}

	.fl_l2 {
		margin-top: 0;
	}

	.form2_flame {}

	.kiyaku_page #contentsbox {
		padding: 10px;
		width: calc(100% - 20px);
	}

	iframe.kiyaku {
		height: 4600px;
	}

	#page article h3 {
		text-align: center;
	}

	article ol {
		padding-left: 0;
	}

	article ul.noStyle li {
		padding-left: 1em;
		text-indent: -1em;
	}

	.sp {
		display: block;
	}
}

@media screen and (max-width: 420px) {
	#header .ship {
		display: none;
	}

	.btn3 {
		width: 100%;
	}

	#footer #ft_l .ft_l1 li {
		margin: 0;
	}

	.contactbox ul li.phone {
		font-size: 14px;
	}

	.contactbox ul li.phone .big {
		font-size: 24px;
	}

	#footer #ft_r .ft_l3 li.form a,
	#footer #ft_r .ft_l3 li.simu a,
	#footer #ft_r .ft_l3 li.mypg a {
		font-size: 14px;
	}

	#footer #ft_r .ft_l3 li.simu a {
		background-position: 2% 50%;
	}
}
}