/**
 * BlankPlate | Yet another HTML5 Starter Kit
 *
 * BlankPlate Main stylesheet
 *
 * @copyright	Copyright 2012, Dimitris Krestos
 * @license		Apache License, Version 2.0 (http://www.opensource.org/licenses/apache2.0.php)
 * @link		http://vdw.staytuned.gr/html5-starter-kit-blankplate/
 * @package		BlankPlate
 * @version		v1.2.3
 */


/*タブ全体を囲む
---------------------------------*/
.tabArea {
  background: url("../img/bg_tab.png") center top;
  overflow: hidden;
}
.tabs_wrap {
	width: 100%;
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 40%);
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 40%);
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 40%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
}
.tabs {
  margin-bottom: 100px;
}
@media only screen and ( max-width: 749px ) {
.tabs {
  margin-bottom: 60px;
}
}
/*タブタイトル部分
---------------------------------*/
.tabs ul{
	width: 90%;
	max-width: 1080px;
	margin: 0 auto;
}

.tabs ul {
	list-style: none outside none;
	margin: 0 auto;
	font-size: 0;
}
.tabs li {
	width: calc(1 / 3 * 100%);
	margin: 10% auto 0;
	display: inline-block;
}

.tabs ul li:nth-child(2) a {
	background: url("../img/tab_sakura.png") no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;  
	-o-background-size: cover; 
	-webkit-transition: background .3s;
	-moz-transition: background .3s;
	-o-transition: background .3s;
	transition:background .3s;
}
.tabs ul li:nth-child(1) a {
	background: url("../img/tab_ariya.png") no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	transition:background .3s;
}
.tabs ul li:nth-child(3) a {
	background: url("../img/tab_leaf.png") no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	transition:background .3s;
}
.tabs ul li:nth-child(2) a:hover {
	background: url("../img/tab_sakura_on.png") no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;  
	-o-background-size: cover; 
	-webkit-transition: background .3s;
	-moz-transition: background .3s;
	-o-transition: background .3s;
	transition:background .3s;
}
.tabs ul li:nth-child(1) a:hover {
	background: url("../img/tab_ariya_on.png") no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	transition:background .3s;
}
.tabs ul li:nth-child(3) a:hover {
	background: url("../img/tab_leaf_on.png") no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	transition:background .3s;
}
.tabs ul li:nth-child(2).active a {
	background: url("../img/tab_sakura_active.png") no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;  
	-o-background-size: cover; 
}
.tabs ul li:nth-child(1).active a {
	background: url("../img/tab_ariya_active.png") no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;  
	-o-background-size: cover; 
}
.tabs ul li:nth-child(3).active a {
	background: url("../img/tab_leaf_active.png") no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;  
	-o-background-size: cover; 
}
.tab_title a {
	display: block;
}

.tabs a  {
	color: #fff;
	display: block;
	text-decoration: none;
	white-space: nowrap;
}

/*.tabs ul li a img {
	opacity: 1;
}
.tabs ul li a:link img:hover {
	opacity: 1;
}
*/
/*現在のタブ
---------------*/
.active {
}
.active a {
	color: white;
}
.tabs ul li.active a img {
}

@media only screen and ( max-width: 599px ) {
	.tabs a  {
	}
}

/*タブコンテンツを囲む
---------------------------------*/
#tab-1,#tab-2,#tab-3 {
}
.tab_box_wrap {
	width: 90%;
	max-width: 1080px;
	margin: 0 auto;
  background: #fff;
  box-shadow: 0 0 8px 6px rgba(0,0,0,0.2);
}
#tab-1 .tab_box_wrap {

}
#tab-2 .tab_box_wrap {
}

/*メインコンテンツ*/
/*.tab_box {
	width: 90%;
	max-width: 1080px;
	margin: 5% auto;
	padding: 0;
}
*/
.tab_item {
  margin: 5% auto 8%;
}
.tab_notice {
  width: 90%;
  margin: 0 auto;
}
.tab_spec_title {
  margin: 8% auto 8%;
}
.tab_spec_item {
  margin: 5% auto;
}
.tab_price_box {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
}
.tab_price {
  width: calc(670 / 1080 * 100%);
  max-width: 670px;
  margin: 0 auto;

}
.tab_photocap {
  width: calc(100% - (670 / 1080 * 100%));
  margin: 0 auto;
  text-align: left;
}
.tab_text {
  font-size: 1.2rem;
  line-height: 1.4;
  padding: 1em;
}
@media only screen and ( max-width: 749px) {
.tab_price_box {
  display: block;

}
  .tab_price {
    width: 100%;
    max-width: none;
  }
  .tab_photocap {
    width: 90%;
    margin: 0 auto;
    font-size: 1.0rem;  
  }
  .tab_text {
    font-size: 1.0rem;  
  }
}
.tab_bvc_box {
  width: calc(980 / 1080 * 100%);
  max-width: 980px;
  margin: 3% auto;
  background: #FFFCCC;
  padding: 3% 1em;
  text-align: left;
}

.tab_btnset_box {
  padding-bottom: 8%;
}
.tab_btnset_box a img:hover {
  opacity: 0.8;
  transition: 0.3s;
}

/*タブ切替用*/
/*.tab_changer {
	width: 10%;
	margin: 0 auto;
}
*/
/*タブコンテンツ背景*/
/*#tab-1 .tab_box {
	background: #66d4f5;
}
#tab-2 .tab_box {
	background: #fff000;
}
#tab-1 .tab_changer {
	background: url("../img/bg_tab1_changer.png") right top / auto 100% no-repeat;
	
}
#tab-2 .tab_changer {
	background: url("../img/bg_tab0_changer.png") left top / auto 100%  no-repeat;
}
*/
/*@media only screen and ( max-width: 639px ) {
.tab_box {
	width: 90%;
	max-width: 840px;
	margin: 0 auto;
}
.tab_changer {
	width: 10%;
	margin: 0 auto;
	}
	#tab-1 .tab_changer {
		background: url("../img/bg_tab1_changer.png") right top / 100% auto no-repeat;
	}
	#tab-2 .tab_changer {
		background: url("../img/bg_tab0_changer.png") left top / 100% auto no-repeat;
	}
}
*/
/*.side_tab {
	display: block;
	width: 100%;
	height: 100%;
	cursor: pointer;
}
*/