@charset "utf-8";

/*
* Webcreative by Kawasaki
* Last Update:2017/06/1
* https://web3.co.jp/
*/

/*===================================================================
	import
===================================================================*/
/*CSSフレームワーク*/
@import url("bootstrap.css");
@import url("font-awesome.css");
@import url("asset.css");

/*基本設定*/
@import url("base.css");
@import url("entry.css");

/*===================================================================
	共通部分
===================================================================*/
.section { margin-bottom:30px; }
.section.wrap:last-child { margin-bottom:0; }
.caption { font-size:0.85em; color:#999; }

/*マウスホバー opacity */
.ov25,.ov50,.ov75 { transition: .2s; }
.ov25:hover { opacity: 0.25; filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=25);}
.ov50:hover { opacity: 0.50; filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=50);}
.ov75:hover { opacity: 0.75; filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=75);}
.oi25:hover img { opacity: 0.25; filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=25);}
.oi50:hover img { opacity: 0.50; filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=50);}
.oi75:hover img { opacity: 0.75; filter:progid:DXImageTransform.Microsoft.Alpha(Enabled=1,Style=0,Opacity=75);}

/* ボタン用 */
.oi { display:block;}
.oi img { background-color:transparent;}
.oi:hover { background-color:transparent;}
.oi:hover img { visibility:hidden;}

/*breadcrumb*/
.breadcrumb { text-align:left; }
.breadcrumb li { display:inline; }
.breadcrumb li::after { content:"\f105"; font-family:FontAwesome; display:inline-block; margin:0 5px 0 10px;}
.breadcrumb li:last-child::after { display:none; }

/*pagination*/
.pagination {}
.pagination li { display: inline-block; padding:5px; }
.pagination li > * { display: block; padding:5px 10px; border: 1px solid; text-decoration:none; }

/*post-item*/
.post-item { margin-bottom:30px; }
.post-item .post-thumbnail {}
.post-item .post-thumbnail a > div { padding-top:60%; }
.post-item .post-contents { padding:10px; }

.h_1 { margin-bottom:20px; padding:10px 15px; background:url(../image/layout/h_back.jpg) no-repeat center center; background-size:100% 100%; color:#FFF; font-weight:bold; text-align:left; }
.h_1 span {color: #f8f01e;}
.h_2 { margin-bottom:10px; padding:10px 0; border-bottom:1px solid #16A68F; color:#16A68F; font-size:1.17em; font-weight:bold; }
p + .h_2,
table + .h_2 { margin-top:30px; }

/*===================================================================
	layout
===================================================================*/
/*-------------------------------------------------------------------
	#base
-------------------------------------------------------------------*/
#base { }
.container { position:relative; text-align:left; }

@media(max-width:1199px) {

	.container { width:100% !important; max-width:100%; }

}

@media(max-width:767px) {

#base { overflow:hidden; }

}


/*-------------------------------------------------------------------
	#head
-------------------------------------------------------------------*/
#head { background:#FFF; }

/* .site_logo */
#gouwan .site_logo,.renew .site_logo{position: relative; top:0; left:0; }
.site_logo { position:absolute; top:39px; left:0; }

@media(max-width:1199px) {

.site_logo { position:absolute; top:39px; left:15px; }

}

@media(max-width:767px) {

.site_logo { position:absolute; top:20px; left:15px; }
.site_logo img { width:200px; }
#gouwan .site_logo img { width:150px; }

}

@media(min-width:768px) {

#head_info .button { display:none; }

}

@media(max-width:767px) {

	#head_info .button { position:absolute; top:7px; right:15px; }
	#head_info .button a { display:block; width:62px; height:62px; background:#FFF url(../image/layout/menu.png) no-repeat center center; background-size:30px auto; border:3px solid #E7404F; border-radius:100px; }
	.renew #head_info .button{    top: -15px;}

}

	/*-------------------------------------------------------------------
		#head_info
	-------------------------------------------------------------------*/
	#head_info { height:150px; }
	#gouwan #head_info { height:auto;  padding: 10px 0;}
	.renew #head_info { height:auto;  padding: 20px 0;}
	#gouwan #head_info .banner,.renew #head_info .banner{    position: absolute; top: 50%; right: 15px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}
	#gouwan #head_info .banner a:hover,.renew #head_info .banner a:hover{opacity: 0.8;}

@media(max-width:767px) {
	.renew #head_info {  padding: 20px 0;}
	#head_info { height:75px; }
	#gouwan #head_info .banner,.renew #head_info .banner{display: none;}

}

	/*-------------------------------------------------------------------
		#main_navi
	-------------------------------------------------------------------*/
	#main_navi { background:#575751; box-shadow:0 1px 2px rgba(0,0,0,0.2); }
	#gouwan #main_navi { background:#091659; }
	#main_navi ul { text-align:center; }
	#main_navi ul li { display:inline-block; }
	#main_navi ul li a { display:block; padding:30px 10px; text-decoration:none; vertical-align:middle; color:#FFF; font-size:18px; font-weight:bold; }
	#main_navi ul li a:not(:last-child) { text-shadow:1px 1px 2px rgba(0,0,0,0.2); }
	#main_navi ul li:last-child a { margin-left:30px; padding:15px 30px 15px 60px; background:#E7404F url(../image/layout/icon_cart.jpg) no-repeat 20px center; border-radius:100px; box-shadow:2px 2px 0px #52524C; font-weight:bold; }


@media(max-width:880px) and (min-width:768px) {

	 { padding:20px 15px; }
	#main_navi ul li:last-child a { padding:10px 30px 10px 60px; }

}

@media(max-width:767px) {

	#head { position:relative; z-index:101; }
	#main_navi ul li a { padding:10px; font-size:13px; }
	#main_navi ul li:last-child a { position:absolute; top:-68px; right:65px; margin-left:0px; padding:37px 15px 8px 15px; background:#E7404F url(../image/layout/icon_cart.jpg) no-repeat center 10px; border-radius:100px; box-shadow:none; font-weight:bold; font-size:10px; }
	#main_navi ul li:last-child a span { display:none; }
	#base.open .menu_back-sp { position:fixed; left:0; top:0; z-index:100; height:100%; width:100%; background:rgba(0,0,0,0.6); }

}

	/*-------------------------------------------------------------------
		#sub_navi
	-------------------------------------------------------------------*/

@media(min-width:768px) {

	#sub_navi ul:nth-child(1) { display:none; }
	#sub_navi { position:absolute; top:-170px; right:0px; }
	#sub_navi li { display:inline-block; margin-left:30px; }
	#sub_navi li a { padding-left:30px; background:url(../image/layout/icon_arrow.jpg) no-repeat left center; text-decoration:none; color:#222; }

}

@media(max-width:1199px) and (min-width:768px) {

	#sub_navi { right:15px; }

}

@media(max-width:880px) and (min-width:768px) {

	#sub_navi { right:15px; }
	#sub_navi li { display:block; }

}

@media(max-width:767px) {

	#sub_navi { display:none; position:absolute; left:0; top:0px; z-index:101; width:100%; background:#FFF; }
	#sub_navi ul li a { display:block; padding:10px 15px; text-decoration:none; color:#222; }
	#sub_navi ul li a:not(last-child) { border-bottom:1px solid #DDD; }
	.open #sub_navi { display:block; }

}

/*-------------------------------------------------------------------
	#body
-------------------------------------------------------------------*/
#body {}

	/* #primary */
	#primary {}

	/* #secondary */
	#secondary {}

	/*-------------------------------------------------------------------
		#page_title
	-------------------------------------------------------------------*/
	#page_title { margin-top:80px; font-size:35px; font-weight:bold; text-align:center; color:#16A68F; line-height:1.3; }
	#page_title:after { content:""; display:block; height:1px; background:#16A68F; width:100px; margin:20px auto 70px; }
	#gouwan #page_title {color: #091659}
	#gouwan　#page_title:after {background:#091659;}

@media(max-width:767px) {

	#page_title { margin-top:40px; font-size:22px; }
	#page_title:after { content:""; display:block; height:1px; background:#16A68F; width:100px; margin:20px auto 40px; }

}

/*-------------------------------------------------------------------
	#foot
-------------------------------------------------------------------*/
#foot { position:relative; }
#foot .copyright { background:#575751; color:#FFF; font-size:12px; line-height:30px; }
#gouwan #foot .copyright { background:#091659;}
#foot .pagetop { position:absolute; right:20px; bottom:30px; }

#foot.renew .foot-navi{background: #575751;}
#gouwan #foot.renew .foot-navi{background: #fff;}
#foot.renew ul{padding: 5px 0;}
#foot.renew ul li a{color: #fff; padding-left: 25px; background: url(../image/layout/icon_arrow.png) no-repeat left center;    text-decoration: none;}
#gouwan #foot.renew ul li a{background: url(../image/layout/icon_tlink.png) no-repeat left center;}
#gouwan #foot.renew ul li a{color: #000; }

@media(min-width:992px) {
	#foot.renew .pagetop{ bottom: 66px;}
	#foot.renew ul li{display: inline-block; margin-right: 15px;}
}
@media (min-width:768px) and (max-width:991px) {
	#foot.renew .pagetop{ bottom: 149px;}
}
@media (max-width:767px) {
	#foot.renew .pagetop{bottom: 178px;}
}

@media (min-width: 768px){
	.visible-xs { display:none !important; }
}

/*===================================================================
	style
===================================================================*/
/*-------------------------------------------------------------------
	#top
-------------------------------------------------------------------*/
#top { }

	/*-------------------------------------------------------------------
		#main_visual
	-------------------------------------------------------------------*/
	#main_visual { padding:50px 0 80px; background:url(../image/content/top/back_1.jpg) repeat center top; }
	#gouwan #main_visual { background:url(../image/content/top/g_back2.jpg) repeat center top; }
	#main_visual img { border-radius:10px; box-shadow:1px 1px 2px rgba(0,0,0,0.2); }
	#main_visual .div1077 { border-radius:10px; box-shadow:1px 1px 2px rgba(0,0,0,0.2); }

@media(max-width:767px) {

	#main_visual { overflow:hidden; margin-bottom:0; margin-left:-15px; margin-right:-15px; padding:0; }
	#main_visual img { border-radius:0px; box-shadow:none; }
	#main_visual .div1077 { border-radius:0px; box-shadow:none; }

}

	/*-------------------------------------------------------------------
		#top_1
	-------------------------------------------------------------------*/
	#top_1 { position:relative; }
	.renew .g-banner{text-align: center;}
	#gouwan #top_1 .banner.head a:hover,.g-banner a:hover { opacity: 0.8;	}
	#gouwan #top_1 .banner.head,.renew .g-banner.head{display: none;}
	#top_1:before { position:absolute; top:-25px; width:100%; z-index:90; content:""; display:block; height:25px; background:url(../image/content/top/back_2.png) repeat left top; background-size:46px 25px; }
	#gouwan #top_1:before{background:url(../image/content/top/g_back2.png) repeat left top; }
	#top_1 { padding:50px 0; background:#9ED7E2 url(../image/content/top/back_3.jpg) no-repeat center bottom; }
	#gouwan #top_1,.renew #top_1 {padding: 25px 0;}
	#gouwan #top_1 { background:url(../image/content/top/g_back3.jpg) repeat center ; }
	#gouwan #top_1  .g_hl{text-align: center;}
	#gouwan #top_1  .g_hl_1{color: #fff; text-align: center; font-size: 2em; font-weight: bold; margin-bottom: 50px; margin-top: 50px; position: relative; display: inline-block; padding: 20px 30px;}
	#gouwan #top_1  .g_hl_1 span{font-size: 0.8em;}
	#gouwan #top_1  .g_hl_1::before {
    content: "";
    top: 0;
    left: 0;
    border-bottom: 30px solid transparent;
    border-left: 30px solid #fff;
    position: absolute;
    z-index: 100;}
	#gouwan #top_1  .g_hl_1::after {
	content: "";
    bottom: 0;
    right: 0;
    border-top: 30px solid transparent;
    border-right: 30px solid #fff;
    position: absolute;}



	#top_1 .hl { position:relative; padding-bottom:30px; text-align:center; }
	#top_1 .hl:before { content:""; position:absolute; left:100px; bottom:20px; z-index:90; display:block; width:175px; height:238px; background:url(../image/content/top/top_1_2.png) no-repeat center center; }
	#top_1 .hl:after { content:""; position:absolute; right:50px; bottom:0; z-index:90; display:block; width:231px; height:281px; background:url(../image/content/top/top_1_1.png) no-repeat center center; }
	#top_1 .hl img { margin-bottom:15px; }
	#top_1 .hl p { text-shadow: 2px 2px 0px #FFF,1px 2px 0px #FFF,2px 1px 0px #FFF,-2px 2px 0px #FFF,-1px 2px 0px #FFF,-2px 1px 0px #FFF,2px -2px 0px #FFF,1px -2px 0px #FFF,2px -1px 0px #FFF,-2px -2px 0px #FFF,-1px -2px 0px #FFF,-2px -1px 0px #FFF; }

	#top_1 .button { text-align:center; }
	#top_1 .unit { margin-bottom:30px; padding:20px; background:#FFF; border-radius:10px; box-shadow:1px 1px 2px rgba(0,0,0,0.1); }
	#top_1 .unit .image { margin-bottom:20px; }
	#top_1 .unit .title { font-weight:bold; font-size:1.17em; }
	#top_1 a { text-decoration:none; color:#222; }
	#top_1 a .unit { border:3px solid #FFF; transition:all 0.2s ease 0s; }
	#top_1 a:hover .unit { border:3px solid #E6975F; }
	#top_1 .price { color:#999; }
	#top_1 .price span { font-size:12px; }

@media(max-width:1199px) {

	#top_1 .hl:before { left:50px; }
	#top_1 .hl:after { right:0px; }

}

@media(max-width:1000px) {

	#top_1 { background:#9ED7E2 url(../image/content/top/back_3.jpg) no-repeat center bottom; background-size:auto 180px; }
	#top_1:before { top:-15px; height:15px; background:url(../image/content/top/back_2.png) repeat left top; background-size:27px 15px; }
	#top_1 .hl { padding-right:170px; text-align:left; }
	#top_1 .hl img { width:100%; }
	#top_1 .hl:before { display:none; }
	#top_1 .hl:after { right:-15px; width:180px; height:281px; background:url(../image/content/top/top_1_1.png) no-repeat center left; }
	#top_1 .row { margin-left:-7px; margin-right:-7px; }
	#top_1 *[class*="col-"] { padding-left:7px; padding-right:7px; }
	#top_1 .unit { margin-bottom:15px; padding:10px; }

}

@media(max-width:767px) {
	#gouwan #top_1 .banner,.renew .g-banner{display:  block!important;}
	#gouwan #top_1 .banner img{width: 80%;}
	.renew .g-banner img{width: 45%;}

}
@media(max-width:575px) {
.renew .g-banner img{width: 80%;}
}

@media(max-width:479px) {

	#top_1 .hl { padding-right:100px; text-align:left; }
	#top_1 .hl:after { right:-15px; width:130px; height:182px; background:url(../image/content/top/top_1_1.png) no-repeat center left; background-size:auto 182px; }
	#top_1 .hl p { font-size:12px; }

}

	/*-------------------------------------------------------------------
		#top_2
	-------------------------------------------------------------------*/
	#top_2 { padding:50px 0; background:url(../image/content/top/back_4.jpg) repeat top center; }
	#gouwan #top_2 { padding:50px 0; background:url(../image/content/top/g_back4.jpg) repeat top center; }
	#gouwan #top_2 .navi{display: flex; flex-wrap: wrap;    justify-content: center;}
	#gouwan #top_2 .navi .link{width: 50%;     padding: 15px;}
	#gouwan #top_2 .navi .link a:hover{opacity: 0.8;}
	#top_2 .hl { margin-bottom:30px; text-align:center; }
	#top_2 .box { padding:30px 30px 0; background:#FFF; }
	#top_2 .box > .mb30 > p,
	#top_2 .box > .mb30 > table th,
	#top_2 .box > .mb30 > table td,
	#top_2 .box > .mb30 > ul { font-size:14px; }
	#top_2 .box > .mb30 > ul { padding:15px 0 0 15px; }
	#top_2 .box > .mb30 > ul li { position:relative; margin-bottom:10px; padding-left:20px; }
	#top_2 .box > .mb30 > ul li:before { content:"●"; position:absolute; left:0; top:0; color:#E7404F; }
	#top_2 p + table { margin-top:15px; }
	#top_2 table th,
	#top_2 table td { padding:10px 15px; border:1px solid #DDD; }
	#top_2 table th { white-space:nowrap; background:#EEE; }
	#top_2 .law { margin:0 -30px; padding:40px 30px 30px; background:#575751; color:#FFF; }
	#top_2 .law h3 { margin-bottom:25px; font-weight:bold; font-size:1.17em; }
	#top_2 .law .overflow { overflow-y:scroll; height:300px; padding:30px; border:1px solid #FFF; }
	#top_2 .law h4 { margin-bottom:7px; padding:0 0 10px; border-bottom:1px solid #FFF; font-weight:bold; }
	#top_2 .law p { margin-bottom:30px; font-size:14px; }

@media(max-width:767px) {
	#gouwan #top_2 .navi .link { width: 100%; padding: 10px;}
	#top_2 .hl { margin-bottom:10px; }
	#top_2 .box { padding:15px 15px 0; }
	#top_2 .law { margin:0 -15px; padding:30px 15px 15px; }
	#top_2 .law h3 { margin-bottom:15px; }
	#top_2 .law .overflow { padding:15px; }
	#top_2 .law p { margin-bottom:20px; }

}


/*-------------------------------------------------------------------
	#item
-------------------------------------------------------------------*/
#item {}

	/*-------------------------------------------------------------------
		#set_list
	-------------------------------------------------------------------*/
	#set_list {}
	#set_list .unit { margin-bottom:40px; padding-bottom:40px; border-bottom:1px solid #DDD; }
	#set_list .unit .hl strong { display:block; padding-top:10px; font-weight:normal; color:#999; font-size:16px; text-align:right; }
	#set_list .unit .hl strong span { font-size:13px; }
	#set_list .unit dl { margin-bottom:20px; }
	#set_list .unit dl dt { margin-bottom:-0.8em; margin-left:1em; color:#E6975F;text-shadow: 2px 2px 0px #FFF,1px 2px 0px #FFF,2px 1px 0px #FFF,-2px 2px 0px #FFF,-1px 2px 0px #FFF,-2px 1px 0px #FFF,2px -2px 0px #FFF,1px -2px 0px #FFF,2px -1px 0px #FFF,-2px -2px 0px #FFF,-1px -2px 0px #FFF,-2px -1px 0px #FFF; }
	#set_list .unit dl dd { padding:15px; background:#FFF8EA; border:2px solid #E6975F; font-size:13px; }
	#set_list .unit .check { padding:15px; background:#EEE; font-weight:bold; }
	#set_list .unit .check select { margin-bottom:15px; margin-left:7px; margin-right:30px; }

@media(max-width:767px) {

	#set_list .unit .row .mb30 { margin-bottom:14px; }
	#set_list .unit .row { margin-left:-7px; margin-right:-7px; }
	#set_list .unit .row *[class*="col-"] { padding-left:7px; padding-right:7px; }

}

	/*-------------------------------------------------------------------
		#item_list
	-------------------------------------------------------------------*/
	#item_list .unit { margin-bottom:20px; border-bottom:1px solid #DDD; }
	#item_list .unit .check { margin-top:10px; margin-bottom:20px; padding:15px; background:#EEE; font-weight:bold; }
	#item_list .unit .check a { display:inline-block; text-decoration:none; background:#FFF; border:1px solid #666; border-radius:4px; color:#666; margin-left:10px; padding:2px 5px; }
	#item_list .unit .row .row { margin-left:-7px; margin-right:-7px; }
	#item_list .unit .row .row *[class*="col-"] { padding-left:7px; padding-right:7px; }

@media(max-width:767px) {

	#item_list .unit .row { margin-left:-7px; margin-right:-7px; }
	#item_list .unit .row *[class*="col-"] { padding-left:7px; padding-right:7px; }

}


/*-------------------------------------------------------------------
	#policy
-------------------------------------------------------------------*/
#policy .p_ul li{ list-style: disc; position: relative; margin: 0 0 5px 20px; word-wrap: anywhere;}

/*-------------------------------------------------------------------
	#facebook
-------------------------------------------------------------------*/
#facebook{text-align: center;}

/*-------------------------------------------------------------------
	#gouwan
-------------------------------------------------------------------*/
#gouwan .slick-prev:before, #gouwan .slick-next:before{color: #000;}


/*-------------------------------------------------------------------
	#open_shcool
-------------------------------------------------------------------*/
#open_shcool {}

/* .form_check */
.form_check { float:right; margin-top:2px; padding:2px 5px; background:#DE4345; color:#FFF; font-size:11px; }

/* .form_button */
.form_button { text-align:center; }
.form_button :hover { transition:all ease 0.2s 0s; }
.form_button input { width:100%; max-width:300px; margin:0 auto; padding:10px; background:#E7404F ; border:2px solid #E7404F ; color:#FFF; font-size:16px; font-weight:bold; }
.form_button input:hover { background:#FFF; color:#E7404F ; }
.form_button span { display:inline-block; position:relative; width:100%; max-width:300px; margin:15px; }
.form_button span:after { content:"\f054"; position:absolute; right:15px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); font-family:FontAwesome; font-size:20px; color:#FFF; transition:all ease 0.2s 0s; }
.form_button span:hover:after { right:10px; color:#E7404F; }

.form_button span.back input { background:#999; border:2px solid #999; }
.form_button span.back input:hover { background:#FFF; color:#999; }
.form_button span.back:after { content:"\f053"; position:absolute; left:15px; right:inherit; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); font-family:FontAwesome; font-size:20px; color:#FFF; transition:all ease 0.2s 0s; }
.form_button span.back:hover:after { left:10px; right:inherit; color:#999; }

/* .tbl_form */
.tbl_form th,
.tbl_form td { padding:15px 10px; border-top:1px dotted #CCC; border-bottom:1px dotted #CCC; }
.tbl_form td input[type*="text"],
.tbl_form td textarea { padding:2px 7px; }
.tbl_form td textarea { width:100%; height:150px; }
.tbl_form td dl dt { margin-bottom:5px; }
.tbl_form td dl dd + dt { margin-top:20px; }
.tbl_form .w100p { width:100%; }

@media (max-width:767px) {

/* .tbl_block-sp */
table.tbl_block-sp,
table.tbl_block-sp thead,
table.tbl_block-sp tbody,
table.tbl_block-sp tr,
table.tbl_block-sp tr > th,
table.tbl_block-sp tr > td { display:block; width:100%; padding-left:0; padding-right:0; }

.tbl_form th { padding-bottom:0; border-bottom:none; color:#1BA78E; }
.tbl_form td { padding-top:10px; border-top:none; }
.tbl_form td dl dt { margin-bottom:10px; padding:5px 7px; background:#EEE; font-size:13px; }
.tbl_form tr + tr th,
.tbl_form tr + tr td { border-top:none; }

}

@media (max-width:360px) {

.form_button span { width:calc(100% - 30px); max-width:inherit; }

}

/*-------------------------------------------------------------------
	#form
-------------------------------------------------------------------*/
#form {}

	/* #error */
	#error { margin-bottom:15px; padding:15px; background:#F8EAE8; border:2px solid #BC2F1C; color:#BC2F1C; text-shadow:0 1px 0 #FFF;　-moz-border-radius:4px;　-webkit-border-radius:4px;　border-radius:4px; }

.row-eq-height { display:flex; flex-wrap:wrap; }