/*---------------------------------------------------------
Theme Name:		ZettaiPrime Child
Template:		zettaiprime
Theme URI:		http://zettaiprime.jp/
Author: 		Wellenetz Inc.
Author URI:		https://www.wellenetz.co.jp/
Description:	絶対達成プライム専用子テンプレート
Version: 		1.0.0
Text Domain:	zettaiprime
---------------------------------------------------------*/
/**-------------------------------------------------------
	利用グリッドサイズ ()はBootstrap３でのクラス名
	スマホ(xs): 767pxまで			(max-width:767px)
	タブレット(sm):768px以上		(min-width:768px)
---------------------------------------------------------*/

/* common */
.center {text-align:center}
.bold {font-weight:600}
.circle {height:130px;width:130px;color:#fff;font-size:32px;font-weight:600;line-height:1.2;text-align:center;float:left;
	display:flex;justify-content:center;align-items:center;border-radius:50%;-moz-border-radius:50%;-webkit-border-radius:50%;}
.bg_blue {background:#007db6;}
.c_blue {color:#007db6;}
.bg_green {background:#89c211;}
.c_green {color:#89c211;}
.bg_bgreen {background:#1b862c}
.c_bgreen {color:#1b862c}
.bg_bgreen2 {background:#38b7ab}
.c_bgreen2 {color:#38b7ab}
a.details {font-size:16px;display:inline-block;margin-top:10px;margin-left:20px;
	padding:2px 10px;border-radius:4px;font-weight:600;background:#ccc;color:#333;text-decoration:none}


/* Full */
@media (min-width: 768px) { .full {width:100vw;margin:0 calc(360px - 50vw);} }
@media (min-width: 992px) { .full {width:100vw;margin:0 calc(475px - 50vw);} }
@media (min-width: 1200px) { .full {width:100vw;margin:0 calc(575px - 50vw);} }

/* header */
header .site-branding .site-title {background: url(./images/cropped-logo.gif) no-repeat left center;background-size: 80px auto;}
.container-fluid {padding-left: 10px;}

/*
h1.site-description {display:block !important;font-size:12px !important;color:#d9b64c !important;font-weight:600;}
header .site-branding .site-title .navbar-brand {color:#d9b64c !important;padding-top:5px !important}
@media (min-width:768px) {
	.navbar {min-height:130px !important}
	h1.site-description {transform:translateY(-10px);font-size:16px !important;font-weight:600;color:#d9b64c !important}
	.navbar-brand {font-size:24px !important;font-weight:600;color:#d9b64c !important}
	.container-fluid {padding:30px 0}
	.menu-bar {background-color: #1d324c !important;}
}
.main-navigation ul > li.menu-item {border-right:1px dotted #fff;width:auto;display:inline-block;}
.main-navigation ul > li.menu-item:last-child {border-right:none}
#global-menu ul {font-size:0;text-align:center;padding-left:80px}
.main-navigation ul > li.menu-item > a {font-size:14px;padding-left:40px;padding-right:40px;display:inline-block;}
*/

/* main visual */
.full .left {width:31%;float:left}
.full .right {width:31%;float:right}
.full .left img, .full .right img {margin:0}
.full .center1 {background:#89c211;color:#fff;text-align:center;margin:0;padding:20px;height:32.25vw;
	display:flex;justify-content:center;align-items:center;}
.full .center1 h1 {font-size:2.5vw}
.full .center1 h1.second {font-size:1.8vw}
.full .center1 .big {font-size:4.3vw;color:#fff100}
.full .center1 .sub {font-size:16px;}
.full .center1 .under {border-bottom:1px solid #fff;}
.full .center2 {background:#000;color:#fff;text-align:center;margin:0;padding:10px;height:16.12vw;font-size:1.2vw;
	display:flex;justify-content:center;align-items:center;}
.full .center2 .border {display:inline-block;padding:10px;border:1px solid #fff;margin-bottom:10px;}
.full .center2 a {display:inline-block;padding:10px 20px; color:#fff;text-decoration:none;margin:10px 0 0}

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

	.full {display:flex;flex-direction:column}
	.full .left_right {order:3}
	.full .left {width:50%;float:left;}
	.full .right {width:50%;float:right;}
	.full .center1 {height:auto;font-size:14px;padding:30px 0;order:1}
	.full .center1 h1 {font-size:5vw}
	.full .center1 h1.second {font-size:3.6vw}
	.full .center1 .big {font-size:9vw;}
	.full .center2 {height:auto;font-size:3.5vw;padding:40px 0;order:2}

}

/* Hisaku */
#hisaku {background:#ececec;padding:50px 0;}
#hisaku h1 {font-size:46px !important;font-weight:500;margin:30px 0;}
#hisaku h2 {font-size:22px !important;font-weight:600;min-height:100px;padding:10px 0;}
#hisaku .items {width:100%;display:flex;justify-content:space-between;flex-direction:row;}
#hisaku .items .item {display:inline-block;width:32%;padding:0;vertical-align:top;}
#hisaku .items .item .item_in {background:#fff;min-height:230px;position:relative;padding:10px 20px 40px;border-radius:0 0 10px 10px}
#hisaku .items .item img {display:block;margin:0 auto;border-radius:10px 10px 0 0;}
#hisaku .items .item h2 {font-size:20px;text-align:center}
#hisaku .items .item h2 span {font-size:14px}
#hisaku .items .item .small {font-size:16px !important;letter-spacing:-0.12em;margin:0;}
#hisaku .items .item .sub {font-size:18px;font-weight:600;color:#22ac38}
#hisaku .items .item .check {padding-left:15px;background:url(./images/check.png) top 2px left no-repeat;font-size:16px;letter-spacing:-0.1em;}
#hisaku .items .item .details {text-align:right;}
#hisaku .items .item .details a {position:absolute;bottom:10px;right:10px;
	display:inline-block;font-size:14px;color:#333 !important;font-weight:600;text-decoration:none;}

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

	#hisaku {padding:20px 20px}
	#hisaku .items {display:block;}
	#hisaku .item {margin:10px 0 30px !important;}
	#hisaku .item img.hisaku_image {width:100%;}
	#hisaku h1 {font-size:24px !important}
	#hisaku .items {width:100%;display:block;}
	#hisaku .items .item {display:block;width:100%;margin:0 auto;}

}

/* Top Banner */
#top_banner {padding:35px 0;text-align:center;}
#top_banner .green_circle {background:#89c211;height:100px;width:100px;color:#fff;font-size:24px;font-weight:600;line-height:100px;text-align:center;
	border-radius:50%;-moz-border-radius:50%;-webkit-border-radius:50%;display:inline-block;}
#top_banner .price {display:inline-block;font-size:4.5vw;font-weight:600;line-height:1.1;margin-left:30px;vertical-align:middle}
#top_banner .price span {font-size:2vw;}
#top_banner .remarks {display:inline-block;margin-left:100px;font-size:28px;vertical-align:middle}

.btn-gradient {display:inline-block;width:100%;text-align:center;font-size:40px;font-weight:600;padding:20px;text-decoration:none;margin:25px 0;
	color:#FFF;transition:.4s;text-shadow: 2px 2px 1px #3d7702;background:linear-gradient(#3d7702 0%,#ccec7e 50%,#3d7702 100%);}
.btn-gradient:before {content:url(./images/arrow.png);display:inline-block;margin-right:20px;}
.btn-gradient:hover {background-image:linear-gradient(#ccec7e 0%, #3d7702 70%);}

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

	#top_banner .price {font-size:9vw;}
	#top_banner .price span {font-size:3vw;}
	#top_banner .green_circle {display:inline-block;}
	#top_banner .price {display:block;width:100%;margin-left:0;text-align:center}
	#top_banner .remarks {display:block;width:100%;font-size:20px;margin-left:0;text-align:center}
	.btn-gradient {margin:10px auto;font-size:4.5vw}
	.btn-gradient:before {margin-right:6px;}

}


/* Top Special */
#top_special {padding:35px 0;}
#top_special h2 {font-size:40px !important;margin:35px 0 !important;color:#333;text-align:center;}
	/* upside */
#top_special #upside {background:#c7e4f5 url(./images/upside_back.jpg) no-repeat;background-position:top 120px center;background-size:cover;
	overflow:hidden;padding:0 0 30px;}
#top_special #upside .left {width:47%;float:left;min-height:350px;padding:30px 20px;background:rgba(255,255,255,0.8);margin-top:35px;
	border-radius:10px;position:relative}
#top_special #upside .right {width:47%;float:right;min-height:350px;padding:30px 20px;background:rgba(255,255,255,0.8);margin-top:35px;
	border-radius:10px;position:relative}
#top_special #upside .left h3, #top_special #upside .right h3 {font-size:24px;font-weight:600;text-align:center;color:#000;background:none !important}
#top_special #upside .left p, #top_special #upside .right p {margin:10px 0;text-align:center;font-size:15px}
#top_special #upside span {color:#c71010 ;font-size:28px; font-weight:bold;}
#top_special #upside .big {font-size:40px !important;}
#top_special #upside span.small {font-size:14px}
#top_special hr.dot {border-top:1px dotted #666;width:80%;margin:0 auto}
#top_special #upside a.details {position:absolute;bottom:20px;right:40px}
	/* downside */
#top_special #downside {background:#fff;padding:30px;}
#top_special #downside .item {display:inline-block;width:45%;margin:10px 1.4%;padding:20px;background:#f2f2f2;border-radius:10px;
	box-shadow:2px 3px 5px #c4c4c4;vertical-align:top;}
#top_special #downside .item > .title {font-size:20px;margin-left:150px;}
#top_special #downside .item a.details {margin-top:10px;margin-left:20px;}

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

	#top_special #upside {background-size:cover}
	#top_special h2 {font-size:26px !important;margin:35px 0 !important;}
	#top_special #upside .left, #top_special #upside .right {width:100% !important}

	#top_special #downside {padding:10px;}
	#top_special #downside .item {width:100%;}
	#top_special #downside .item .circle {margin:10px auto;float:none;}
	#top_special #downside .item .title {display:block;margin-left:0;width:100% !important}
	#top_special #downside .item a.details {float:right}

}

/* Top Recommend */
#top_recommend {background:#dde64d;}
#top_recommend h1 {margin-top:40px;line-height:1.4}
#top_recommend img {float:left;padding-right:60px;margin:0}
#top_recommend p {padding:20px 0;font-size:17px;}

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

	#top_recommend h1 {font-size:28px;text-align:center}
	#top_recommend p {padding:20px 0;font-size:16px;}
	#top_recommend img {float:none;display:block;padding-right:0;margin:0 auto}
}

/* Font Responsive */
@media (min-width: 768px) {
#hisaku h1 {font-size:26px !important;}
#hisaku h2 {font-size:16px !important;}
#top_special h2 {font-size:26px !important}
#downside h2 {font-size:28px !important}
#top_special #downside .item > .title {font-size:16px !important}
}
@media (min-width: 992px) {
#hisaku h1 {font-size:36px !important;}
#hisaku h2 {font-size:18px !important;}
#top_special h2 {font-size:30px !important}
#downside h2 {font-size:32px !important}
#top_special #downside .item > .title {font-size:18px !important}
}
@media (min-width: 1200px) {
#hisaku h1 {font-size:46px !important;}
#hisaku h2 {font-size:22px !important;}
#top_special h2 {font-size:40px !important}
#downside h2 {font-size:40px !important}
#top_special #downside .item > .title {font-size:20px !important}
}