/*-----------------
Start Common
-------------------*/
@font-face{
	font-family:robot;
	font-weight:normal;
	src:url("../font/Roboto-Medium.ttf") format("TrueType");
}
@font-face{
	font-family:robot_italic;
	font-weight:normal;
	src:url("../font/Roboto-Italic.ttf") format("TrueType");
}
html.no-ie{
	margin-top: 0 !important;
}
html.front{
	height: 100%;
}
html.front body{
	height: 100%;
}
#wpadminbar{
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	opacity: 0.5;
}
#wpadminbar:hover{
	opacity: 1;
}
textarea{
	font-family:'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
body{
	margin:0;
	font-family:'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	position:relative;
	color: #000;
	font-size: 14px;
}
p,h1,h2,h3,h4,h5,h6,ul,dl,dt,dd,figure{
	margin:0;
	padding:0;
}
table{
	border-collapse:collapse;
}
a{
	text-decoration:none;
	color:#000
}
p{
	line-height:1.3em;
    word-break: break-all;
}
img{
	vertical-align:bottom;
	width:100%;
}
li{
	list-style:none;
}
.robot{
	font-family:'robot', sans-serif;
	font-weight:normal;
}
.robot_italic{
	font-family:'robot_italic', sans-serif;
	font-weight:normal;
}
.mincho{
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
.goth{
	font-family:'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
.cl:after{
	content:"";
	display:block;
	clear:both;
	visibility:hidden;
}
.trans{
	backface-visibility: hidden;
	transition:0.3s ease-out;
}
.trans:hover{
	opacity:0.8;
}
.bold{
	font-weight: bold;
}
.center{
	text-align: center;
}
.wrap{
	width: 90%;
	max-width: 940px;
	margin: 0 auto;
}
.wrap.itemlist_wrap{
	max-width: 1070px;
}
.wrap-short{
	width: 90%;
	max-width: 760px;
	margin: 0 auto;
}
body:after{
	content:"pc";
	display:none;
}
figure {
	text-align: center;
	margin-bottom: 30px;
}
figure img{
	margin-left: auto;
	margin-right: auto;
	width: auto;
	max-width: 100%;
	vertical-align: bottom;
}
#breadcrumb{
	padding: 10px 0;
	box-sizing:border-box;
}
#breadcrumb .crumb{
	display: inline-block;
	font-size: 13px;
}
.talign_center{text-align: center;}
.talign_left{text-align: left;}
.talign_right{text-align: right;}
/*デバイス*/
@media(min-width: 1px) and (max-width: 1000px){
}
@media(min-width: 1px) and (max-width: 940px){
	body:after{content:"mo"}
}
@media (min-width: 1px) and (max-width: 640px){
}
/*-----------------
End Common
-------------------*/

/*-----------------
Start Header
-------------------*/
#header{
	background: #fff;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100px;
	z-index: 9999;
}
#header .hd_wrap{
	position: relative;
	max-width: 940px;
	margin: auto;
}
#header .hd_wrap .logo{
	position: absolute;
	top: 0;
	left: 0;
    padding: 4px 0px;
}
#header .hd_wrap .control{
    width: 740px;
    position: absolute;
    top: 0;
    right: 0;
    padding: 20px 0;
}
#header .hd_wrap .control .line{
	float: left;
    padding: 17px 0;
}
#header .hd_wrap .control .tel{
	float: left;
	margin-left: 10px;
	padding: 15px 0;
}
#header .hd_wrap .control .btn{
	float: left;
	margin-left: 10px;
}
#header .hd_wrap .control .pc{
	display: block;
}
#header .hd_wrap .control .sp{
	display: none;
}
@media(min-width: 1px) and (max-width: 940px){
	#header .hd_wrap .control .btn{
		display: none;
	}
	#header .hd_wrap .control .pc{
		display: none;
	}
	#header .hd_wrap .control .sp{
		display: block;
	}
	#header .hd_wrap .logo{
		width: 60px;
		padding: 0;
	}
	#header .hd_wrap .control{
		padding: 0;
	    width: 171px;
	}
	#header .hd_wrap .control .tel{
		margin-left: 0;
		border-left: 1px solid #828282;
		padding: 0;
	}
	#header .hd_wrap .control .tel a{
		display: block;
		padding: 10px;

	}
	#header .hd_wrap .control .line{
		padding: 0 10px;
	}
	#header{
		height: 60px;
	}
}
/*-----------------
End Header
-------------------*/


/*-----------------
Start Footer
-------------------*/
#footer{}
#footer .ft_wrap{
	max-width: 940px;
	margin: auto;
	width: 90%;
}
#footer .ft_wrap .ft_cont{
	text-align: center;
	line-height: 1.8em;
	margin-bottom: 30px;
}
#footer .ft_wrap .ft_cont span{
	color: #0aa0b7;
}
#footer .copy{
	text-align: center;
	background: #dddddd;
	padding: 10px;
}
/*-----------------
End Footer
-------------------*/

/*-----------------
Start Main
-------------------*/
#main{
	padding-top: 100px;
}
#main #mv{
	background: url(../img/mv.png) center no-repeat;
	background-size: cover;
}
#main #mv .layer{
	padding: 50px 0;
	margin: 0 auto;
	position: relative;
	max-width: 640px;
}
#main #mv .layer h1{
	font-size: 80px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	text-shadow: 2px 2px 2px #000;
	line-height: 1.2em;
	margin-bottom: 10px;
}
#main #mv .layer h1 span{
	display: inline-block;
	border-bottom: 3px solid #fff;
	padding-bottom: 3px;
}
#main #mv .layer .copy{
	text-align: center;
	color: #fff;
	font-size: 33px;
	text-shadow: 2px 2px 2px #000;
	line-height: 1.2em;
	margin-bottom: 20px;
}
#main #mv .layer .copy2{
	background: rgba(255,255,255,0.4);
	box-sizing: border-box;
	padding: 10px 30px;
	display: table;
	margin: auto;
}
#main #mv .layer .copy2 .copy2_t{
	display: table-cell;
	vertical-align: middle;
	padding-right: 30px;
	text-align: center;
	color: #fff;
	font-size: 20px;
	text-shadow: 2px 2px 2px #000;
}
#main #mv .layer .copy2 .copy2_t span{
	border-bottom: 1px solid #fff;
}
#main #mv .layer .copy2 .copy2_d{
	display: table-cell;
	vertical-align: middle;
}
#main #mv .layer .yen{
	text-align: center;
	font-size: 60px;
	font-weight: bold;
	color: #fff;
	text-shadow: 2px 2px 2px #000;
}
#main #mv .layer .come{
	position: absolute;
	bottom: 20px;
	right: 0;
	color: #fff;
	text-align: right;

}
.action{
	padding: 30px 0;
}
.action .btn1{
	max-width: 700px;
	margin: 0 auto;
	margin-bottom: 10px;
}
.action .btn2{
	max-width: 500px;
	margin: 0 auto;
}
.blue_ttl{
	text-align: center;
	font-size: 30px;
	color: #0aa0b7;
	line-height: 1.3em;
	padding: 30px 0;
}
.blue_ttl br,
.white_ttl br{
	display: none;
}
.grad{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#04c0be+0,1096bd+100 */
	background: #04c0be; /* Old browsers */
	background: -moz-linear-gradient(top, #04c0be 0%, #1096bd 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #04c0be 0%,#1096bd 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #04c0be 0%,#1096bd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04c0be', endColorstr='#1096bd',GradientType=0 ); /* IE6-9 */
	padding: 30px 0;
}
.white_ttl{
	text-align: center;
	color: #fff;
	font-size: 39px;
	line-height: 1.3em;
	margin-bottom: 30px;
}
.triple{
	margin: 0 -10px;
}
.triple .grid{
	float: left;
	width: 33.3333%;
	padding: 10px;
	box-sizing: border-box;
}
.bg1{
	background: url(../img/bg.png) center no-repeat;
	background-size: cover;
	padding: 30px 0;
}
.bg2{
	background: url(../img/bg2.png) center no-repeat;
	background-size: cover;
	padding: 30px 0;
}
.bg2 .txt{
	color: #fff;
    line-height: 1.9em;
    font-size: 14px;
}
.shelf{
	margin-bottom: 30px;
}
.shelf .grid{
	margin-bottom: 10px;
}
.message{
	background: #fff;
	box-sizing: border-box;
	padding: 30px 200px 30px 30px;
	line-height: 1.8em;
	font-size: 15px;
	position: relative;
	margin-bottom: 30px;
}
.message:before{
	content: "";
	width: 0;
	display: block;
	border-top: 20px solid #fff;
	border-left: 30px solid transparent;
	border-right: 30px solid transparent;
	position: absolute;
	bottom: -20px;
	left: 0;
	right: 0;
	margin: auto;
}
.center_btn {
	text-align: center;
}
.center_btn img{
	width: auto;
	max-width: 100%;
}
.center_btn .pc{
	display: inline;
}
.center_btn .sp{
	display: none;
}
.message .chara{
    position: absolute;
    top: 20px;
    right: -60px;
    width: 214px;
}
.card{
	background: #fff;
	padding: 15px 30px;
	box-sizing: border-box;
	display: table;
	width: 100%;
	margin-bottom: 30px;
}
.card .c_fig{
	display: table-cell;
	vertical-align: middle;
	width: 200px;
	padding-right: 30px;
}
.card .det{
	display: table-cell;
	vertical-align: middle;
	line-height: 1.8em;
	font-size: 15px;
}
.fig{
	text-align: center;
	margin-bottom: 30px;
}
.fig img{
	width: auto;
	max-width: 100%;
}
.support{}
.support .grid{
	box-sizing: border-box;
	padding: 20px 30px;
	border: 1px solid #fff;
	margin-bottom: 30px;
}
.support .grid h4{
	text-align: center;
	color: #fff;
	font-size: 25px;
	font-weight: bold;
	line-height: 1.3em;
	margin-bottom: 30px;
}
.support .grid h4 span{
	border-bottom: 1px solid #fff;
	background: url(../img/i01.png) left center no-repeat;
	background-size: 30px;
	padding-left: 40px;
	display: inline-block;
}
.support .grid .table_box{
	display: table;
	width: 100%;
	border-collapse: separate;
	border-spacing: 20px 10px;
}
.support .grid .table_box .cell{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	width: 33.3333%;
	background: #fff;
	padding: 30px 20px;
	font-size: 15px;
}
.support .grid .tr_att{
	text-align: right;
	color: #fff;
	padding-top: 10px;
}
#form table{
	width: 100%;
}
#form table tr th{
	background: #dddddd;
	padding: 10px;
	vertical-align: top;
	text-align: left;
	font-weight: normal;
	width: 200px;
	border: 2px solid #fff;
}
#form table tr th .require{
	color: #fff;
	background: #e60012;
	border-radius: 3px;
	display: inline-block;
	line-height: 1em;
	padding: 3px 5px;
	margin-left: 10px;
}
#form table tr th .unrequire{
	color: #fff;
	background: #1939af;
	border-radius: 3px;
	display: inline-block;
	line-height: 1em;
	padding: 3px 5px;
	margin-left: 10px;
}
#form table td{
	border: 2px solid #fff;
	padding: 10px;
	background: #efefef;
}
#form input[type="text"]{
	font-size: 18px;
	width: 300px;
}
#form input[type="text"]#last_name,
#form input[type="text"]#first_name{
	width: 100px;
}
#form input[type="text"]#email{
	margin-bottom: 5px;
}
#form select{
	height: 27px;
}
#form textarea{
	width: 100%;
	height: 150px;
	resize:none;
	box-sizing: border-box;
	font-size: 18px;
}
#form table{
	margin-bottom: 30px;
}
#form #confirm,
#form #send{
	color: #fff;
	font-size: 18px;
	text-align: center;
	background: #0aa0b7;
	border: none;
	padding: 10px 30px;
	line-height: 1em;
	width: 250px;
	display: block;
	margin: 0 auto 30px;
	cursor: pointer;
	box-shadow: 5px 5px 0px 0px #e5e5e5;
	box-sizing: border-box;
}
#form #back{
	color: #fff;
	font-size: 18px;
	text-align: center;
	background: #dddddd;
	border: none;
	padding: 10px 30px;
	line-height: 1em;
	width: 250px;
	display: block;
	margin: 0 auto 30px;
	cursor: pointer;
	box-shadow: 5px 5px 0px 0px #e5e5e5;
	box-sizing: border-box;
}
#form #confirm span{
	background: url(../img/i02.png) right center no-repeat;
	padding-right: 20px;
	line-height: 1em;
}
.shelf .grid .pc{display: block;}
.shelf .grid .sp{display: none;}
.triple .grid .pc{display: block;}
.triple .grid .sp{display: none;}
.form_ttl{
	display: none;
}
.flow .pc{display: block;}
.flow .sp{display: none;}
.errorstr{
	color: red;
	display: block;
}
@media(min-width: 1px) and (max-width: 1080px){
	.message .chara{
		display: none;
	}
	.message{
		padding: 30px;
	}
}
@media(min-width: 1px) and (max-width: 940px){
	#main {
    	padding-top: 60px;
	}
	#main #mv .layer h1 {
    	font-size: 60px;
	}
	.blue_ttl{
		font-size: 20px;
	}
	.white_ttl{
		font-size: 29px;
	}
	#main #mv .layer .copy{
		font-size: 25px;
	}
}
@media(min-width: 1px) and (max-width: 640px){
	#main #mv{
		background: url(../img/mv-s.png) center no-repeat;
		background-size: cover;
	}
	#main #mv .layer{
		max-width: 290px;
		width: 90%;
	}
	#main #mv .layer h1 {
	    font-size: 36px;
	}
	#main #mv .layer .copy {
	    font-size: 18px;
	}
	#main #mv .layer .copy2 .copy2_d{
		display: none;
	}
	#main #mv .layer .copy2{
		display: block;
	}
	#main #mv .layer .copy2 .copy2_t{
		display: block;
		font-size: 17px;
		padding: 0;
	}
	#main #mv .layer .yen{
		font-size: 35px;
	}
	#main #mv .layer .come{
		position: static;
		display: block;
		text-align: center;
	}
	.triple .grid .pc{display: none;}
	.triple .grid .sp{display: block;}
	.shelf .grid .pc{display: none;}
	.shelf .grid .sp{display: block;}
	.triple .grid{
		width: 50%;
	}
	.triple.bxsl{
		margin: 0;
	}
	.triple.bxsl .grid{
		box-sizing: border-box;
		padding: 0;
	}
	.white_ttl {
    	font-size: 24px;
	}
	.bx-wrapper{
		margin: 0 20px;
		position: relative;
	}
	.bx-wrapper .bx-prev{
		position: absolute;
		top: 50%;
		left: -18px;
		margin: auto;
		margin-top: -19px;
	}
	.bx-wrapper .bx-next{
		position: absolute;
		top: 50%;
		right: -18px;
		margin: auto;
		margin-top: -19px;
	}
	.center_btn .pc{
		display: inline;
	}
	.center_btn .sp{
		display: none;
	}
	.card .c_fig{
		display: block;
		padding-right: 0;
		margin: 0 auto 10px;
	}
	.card .det{
		display: block;

	}
	.support .grid .table_box{
		display: block;
	}
	.support .grid .table_box .cell{
		display: block;
		width: auto;
		margin-bottom: 10px;
	}
	.support .grid .tr_att{
		text-align: center;
	}
	#form table{
		display: block;
	}
	#form table tbody{
		display: block;
	}
	#form table tr{
		display: block;
	}
	#form table tr th{
		display: block;
		width: auto;
		box-sizing: border-box;
	}
	#form table td{
		display: block;
		box-sizing: border-box;
		width: auto;
	}
	#form input[type="text"]{
		width: 100%;
		box-sizing: border-box;
	}
	.form_ttl{
		display: block;
		color: #fff;
		background: #0aa0b7;
		text-align: center;
		font-weight: bold;
		font-size: 20px;
		padding: 10px;
		box-sizing: border-box;
		margin-bottom: 10px;
	}
	.flow .pc{display: none;}
	.flow .sp{display: block;}
	.blue_ttl br,
	.white_ttl br{
		display: block;
	}
}
/*-----------------
End Main
-------------------*/
.pcv{display: block;}
.tbv{display: none;}
.spv{display: none;}
@media(min-width: 641px) and (max-width: 940px){
	.pcv{display: none;}
	.tbv{display: block;}
	.spv{display: none;}
}
@media(min-width: 1px) and (max-width: 640px){
	.pcv{display: none;}
	.tbv{display: none;}
	.spv{display: block;}
}