@charset "utf-8";



/*全端末（PC・タブレット・スマホ）共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*全体の設定
---------------------------------------------------------------------------*/
html,body {height: 100%;}
body {
	margin: 0px;
	padding: 0px;
	color: #fff;	/*全体の文字色*/
	/*font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;	/*フォント種類*/
	font-family: "Montserrat","游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W8","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif;
	font-size: 16px;	/*文字サイズ*/
	line-height: 1.5em;		/*行間*/
	-webkit-text-size-adjust: none;
	background:#000;
}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {margin: 0px;padding: 0px;font-size: 100%;font-weight: normal;}
ul {list-style-type: none;}
ol {padding-left: 40px;padding-bottom: 15px;}
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
table {border-collapse:collapse;font-size: 100%;border-spacing: 0;}
iframe {width: 100%;}

@keyframes opa1 {
0% {opacity: 0;}
100% {opacity: 1;}
}



/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
	color: #fff;		/*リンクテキストの色*/
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
}
a:hover {
	color: #ff4765;			/*マウスオン時の文字色*/
	text-decoration: none;	/*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}

/*コンテンツ（上のcontainerの中のブロック）
---------------------------------------------------------------------------*/
#home {
	width: 100%;	/*最大幅。これ以上広くならない指定。*/
	margin: 0 auto;
	padding: 50px 0%;
	display:inline-block;
}

/*ヘッダー（一番上の、ロゴが入っているブロック）
---------------------------------------------------------------------------*/
header {
	height: 100%;
	overflow: hidden;
	position: relative;
}

/*トップ　左右分けのコンテンツ*/
#top-contents{
	max-width: 1400px;	/*最大幅。これ以上広くならない指定。*/
	margin:0 auto;
	position:relative;
}
#top-contents .top-left{
	width:40%;
	float:left;
	text-align: center;
		padding:12% 3% 0 7%;
	position: relative;
}
#top-contents .top-right{
	width:40%;
	float:right;
	text-align: center;
		padding:12% 7% 0 3%;
	position: relative;
}



/*下方スクロール
---------------------------------------------------------------------------*/
.arrow{
	display: block;
	width: 10%;	/*画像の幅*/
	position: absolute;
	left: 45%;		/*ロゴやメニューが入っているブロックに対して、左からの配置場所の指定。*/
	bottom: 0%;	/*ロゴやメニューが入っているブロックに対して、下からの配置場所の指定。*/
	text-align:center;
}

/*コンテナー（headerとfooterをのぞくブロックを囲むブロック）
---------------------------------------------------------------------------*/
#container {
overflow: auto;
}
/*完了ページのみ適応*/
#container.thanks{
	height:100%;
}

/*コンテンツ（上のcontainerの中のブロック）
---------------------------------------------------------------------------*/
#contents {
	width: 100%;	/*最大幅。これ以上広くならない指定。*/
	margin: 0 auto;
	padding: 50px 0 0 0;
	display:inline-block;
}

/*sectionの下にsectionの場合
---------------------------------------------------------------------------*/
#contents section + section {
	padding-top: 50px;
}

/*マーク　右寄せ*/
.r-image{
	float:right;
}
.r-image img{
	width:150px;
}

/*コンテンツ内にあるh2(見出し)タグの指定　　青文字*/
#contents h2 {
	margin-bottom: 40px;
	clear: both;
	/*padding: 0 20px;*/
	font-size: 16px;		/*文字サイズ*/
	/*text-align: center;		/*文字をセンタリング*/
	letter-spacing: 0.1em;	/*文字間隔を少しだけ広くする指定*/
	color: #fff;			/*文字色*/
	max-width:1400px;
}

/*コンテンツ内にあるp(段落)タグ設定*/
#contents p {
	padding: 0px 20px 20px;	/*上、左右、下への余白*/
}
/*他。微調整。*/
#contents p + p {
	margin-top: -5px;
}
#contents h2 + p,
#contents h3 + p {
	margin-top: -10px;
}

/*内側枠　ここで表示幅を指定
---------------------------------------------------------------------------*/
.inner{
	max-width: 1400px;	/*最大幅。これ以上広くならない指定。*/
	margin: 0 auto;
	/*overflow: hidden;*/
	padding: 10px 3%;
	clear:both;
}

/*パーツセレクト　tab切り換え
---------------------------------------------------------------------------*/
/*---------- vertical tab nav */
#vertical_tab_nav{
  display: block;
  width: 68%;
}
#vertical_tab_nav ul{
  display: block;
  float: left;
  margin: 0px;
  padding: 0px;
  list-style: none;
  overflow: hidden;
  width: 25%;
  border-radius: 10px 0 0 10px;
  /*background: #555;*/
}
#vertical_tab_nav li{
  border-bottom: 1px solid #000;
  margin-bottom: 1px;
  text-align: left;
  padding: 0px;
}
#vertical_tab_nav li:last-child{
  margin-bottom: 0px;
  border-bottom: 0px;
}
#vertical_tab_nav li a{
  display: block;
  font-size: 14pt;
  color: #fff;
  text-decoration: none;
  padding: 7%;
  /*background: #57cac9;
  background: -webkit-linear-gradient(top,#444,#333);
  background: -moz-linear-gradient(top,#444,#333);*/
}
#vertical_tab_nav li a.selected{
  background: #fff;
  color: #000;
}


#vertical_tab_nav article{
  display: none;
  margin: 0px;
  color: #555;
  
}
#vertical_tab_nav div article p{
  margin: 0px 0px 20px 0px;
}


/*tabの色*/
.orange{
	background:#eb6b20!important;
}
.pink{
	background:#e84572!important;
}
.perple{
	background:#a7459c!important;
}
.blue-perple{
	background:#6350a1!important;
}
.blue{
	background:#1a76bf!important;
}
.light-blue{
	background:#1ba2da!important;
}
.green{
	background:#5ec2ba!important;
}
/*tabここまで*/


/*サムネイル*/
.sumbnail{
  display: flex;
  flex-wrap: wrap;
  background: #fff;
  background: #fff;
  width:64%;
  /*min-height: 500px;*/
  padding: 4%;
  border-radius: 0 10px 10px 0;
}
.parts{
	width:33%;
	float:left;
	text-align:center;
	margin-bottom:20px;
}
.parts img{
	width:80%;
    margin:0 10%;
	background:#ccc;
}

/*各ブロックごとの設定*/
.list {
	width:100%;
	line-height: 1.5;
	padding: 20px 0 0 0;	/*ボックス内の余白*/
}


/*サムネイル選択エリア　（左側）*/
.list-left{
	width:70%;
	float:left;
}

/*プレビューエリア（右側）
---------------------------------------------------*/
.list-right{
	width:30%;
	float:right;
	display:inline-table;
	vertical-align:top;
	position:relative;
	text-align:center!important;
}
/*プレビュー画像*/
.list-right img{
	width:100%;
	border-radius:10px;
	margin: 0 0 0 0%;
}
/*透かし*/
.water-mark{
	position:absolute;
	top:0%;
	left:0;
	width:100%;
	opacity: 0.5;
}
/*リセットボタン*/
.reset{
	background:#C1272D;
	border-radius:20px;
	padding:5px 10px;
	margin-top:30px;
	align:left;
	color:#fff;
	text-align:center;
	width:40%;
	clear:both;
	margin-bottom:20px;
	display:inline-block;
}
.reset:hover{
	background:#8B151A;
}
/*注文ボタン*/
.order{
background:#29ABFF;
	border-radius:20px;
	padding:5px 10px;
	align:left;
	color:#fff;
	text-align:center;
	width:15%;
	clear:both;
	margin-top:10px;
	display:inline-block;
}
.order:hover{
	background:#07639E;
}

/*フォーム　テキスト入力*/
input[type="text"], textarea {
	/*width:80%;*/
	padding:5px;
	margin:10px;
	font-size:110%;
	/*display:block;*/
}

input[type="radio"]{
  transform: scale(1.5); /* 1.5倍 */
  margin:10px;
}


/*完了ページ
--------------------------------------*/
.thankyou{
	text-align:center;
}
.thankyou img{
	width:33%;
}

/*フッター設定
---------------------------------------------------------------------------*/
footer {
	clear: both;
	background: none;	/*背景色*/
	color: #fff;		/*文字色*/
	width:100%;
	padding-top:100px;
	position: relative;
	text-align:center;
	display: flex;
    justify-content: center;
}
/*フッター コピーライト*/
.foot-copy{
	width:100%;
	padding:10px 0;
	float:left;
	display:table;
}
.foot-copy p{
	font-size: 0.8em;		/*文字サイズ*/
}
	
.foot-copy img{
	width:auto;
	height:20px;
	margin: 0px 0px 0px 10px;
　　float:left;
}


footer a {
	color: #fff;	/*リンクテキストの文字色*/
	text-decoration: none;
}
footer a:hover {
	color: #fff;	/*マウスオン時の文字色*/
}


/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
.scroll-show {display: block;}
.scroll a {
	display: block;text-decoration: none;text-align: center;
	width: 50px;		/*幅*/
	line-height: 50px;	/*高さ*/
	position: fixed;
	right: 20px;		/*右からの配置場所指定*/
	bottom: 20px;		/*下からの配置場所指定*/
	color: #fff;		/*文字色*/
	background: rgba(0,0,0,0.4);	/*背景色。0,0,0は黒色の指定で0.4は色が40%出た状態。*/
	border: 1px solid #fff;	/*枠線の幅、線種、色*/
}
/*マウスオン時*/
.scroll a:hover {
	background: rgba(255,255,255,0.2);	/*背景色。0,0,0は黒色の指定で0.8は色が80%出た状態。*/
}

/*ul.disc,olタグ
---------------------------------------------------------------------------*/
ul.disc {
	list-style: disc;
	padding: 0 20px 20px 55px;
}
ol {
	padding: 0 20px 20px 42px;
}

/*その他
---------------------------------------------------------------------------*/
.look {background: #000;border: 1px solid #666;padding: 5px 10px;border-radius: 4px;}
.mb15,.mb1em {margin-bottom: 15px;}
.clear {clear: both;}
ul.disc {padding: 0em 25px 15px 40px;list-style: disc;}
.color1, .color1 a {color: #ff4765;}
.pr {font-size: 10px;}
.wl {width: 96%;}
.ws {width: 50%;}
.c {text-align: center;}
.p20{padding:20px 0;}
.m20{margin:20px 0;}
.r {text-align: right;}
.l {text-align: left;}
.big1 {font-size: 40px;letter-spacing: 0.2em;}
.mini1 {font-size: 11px;display: inline-block;line-height: 1.5;}
.sh {display: none;}
.pc{display:inline;}
.mb{display: none;}/*幅480以下*/
.link {display: block;margin-top: -200px;padding-top: 200px;}

/*画面幅1100px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1100px){
	

/*リセットボタン*/	
.reset{
	background:#C1272D;
	border-radius:20px;
	padding:5px 10px;
	margin-top:30px;
	align:left;
	color:#fff;
	text-align:center;
	width:50%;
	clear:both;
	margin-bottom:20px;
	display:inline-block;
	font-size:16px;
}
/*注文ボタン*/	
.order{
background:#29ABFF;
	border-radius:20px;
	padding:5px 10px;
	align:left;
	color:#fff;
	text-align:center;
	width:25%;
	clear:both;
	margin-top:0px;
	display:inline-block;
	font-size:16px;
}	
	
/*サムネイル*/
.sumbnail{
  display: flex;
  flex-wrap: wrap;
  background: #fff;
  background: #fff;
  width:67%;
  min-height: 350px;
  padding: 10% 4% 0;
  border-radius: 0 10px 10px 0;
}

}




/*画面幅900px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:900px){

/*コンテナー文字の大きさ（headerとfooterをのぞくブロックを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	font-size: 10px;
	font-size: 2.0vw;
}

/*コンテンツ　背景
-------------------------------------------------------------------*/
.bg{
	background-image:url("../images/bg-logo.svg");
	background-repeat:no-repeat;
	background-position:center top 10%;
	background-size:80%;
}
/*ヘッダー（一番上の、ロゴが入っているブロック）
---------------------------------------------------------------------------*/
header {
	height: 100%;
	overflow: hidden;
	position: relative;
}
	
/*トップ　左右分けのコンテンツ*/
#top-contents .top-left{
	width:60%;
	float:left;
	text-align: center;
		padding:5% 20% 0 20%;
	position: relative;
}
#top-contents .top-right{
	width:60%;
	float:left;
	text-align: center;
		padding:5% 20% 0 20%;
	position: relative;
}
	
/*下方スクロール
---------------------------------------------------------------------------*/
.arrow{
	display: block;
	width: 20%;	/*画像の幅*/
	position: absolute;
	left: 40%;		/*ロゴやメニューが入っているブロックに対して、左からの配置場所の指定。*/
	bottom: 5%;	/*ロゴやメニューが入っているブロックに対して、下からの配置場所の指定。*/
	text-align:center;
}

/*表示切替*/
.sh {display: inline;}	
.pc{display:none;}	
	

/*コンテナー文字の大きさ（headerとfooterをのぞくブロックを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	font-size: 12px;
	font-size: 2.0vw;
}
/*コンテンツ内にあるh2(見出し)タグの指定*/
#contents h2 {
	font-size: 13px;	/*文字サイズ*/
}	
	
/*内側枠　ここで表示幅を指定
---------------------------------------------------------------------------*/
.inner{
	max-width: 1400px;	/*最大幅。これ以上広くならない指定。*/
	margin: 0 auto;
	/*overflow: hidden;*/
	padding: 20px 3%;
	clear:both;
}
/*パーツセレクト　tab切り換え
---------------------------------------------------------------------------*/
/*---------- vertical tab nav */
#vertical_tab_nav{
  display: block;
  width: 100%;
}
#vertical_tab_nav ul{
  display: block;
  float: left;
  margin: 0px;
  padding: 0px;
  list-style: none;
  overflow: hidden;
  width: 25%;
  border-radius: 10px 0 0 10px;
  /*background: #555;*/
}
#vertical_tab_nav li{
  border-bottom: 1px solid #000;
  margin-bottom: 1px;
  text-align: left;
  padding: 0px;
}
#vertical_tab_nav li:last-child{
  margin-bottom: 0px;
  border-bottom: 0px;
}
#vertical_tab_nav li a{
  display: block;
  font-size: 14pt;
  color: #fff;
  text-decoration: none;
  padding: 7%;
}
#vertical_tab_nav li a.selected{
  background: #fff;
  color: #000;
}


#vertical_tab_nav article{
  display: none;
  margin: 0px;
  color: #555;
  
}
#vertical_tab_nav div article p{
  margin: 0px 0px 20px 0px;
}

/*tabここまで*/


/*サムネイル*/
.sumbnail{
  display: flex;
  flex-wrap: wrap;
  background: #fff;
  background: #fff;
  width:67%;
  min-height: 350px;
  padding: 6% 4% 2%;
  border-radius: 0 10px 10px 0;
}
.parts{
	width:33%;
	float:left;
	text-align:center;
	margin-bottom:20px;
}
.parts img{
	width:80%;
    margin:0 10%;
	background:#ccc;
}
	


/*スマホ時のプレビュー画像エリア*/	
.list-right{
	width:100%;
	aligh:left;
	display:inline-table;
	vertical-align:top;
	position:relative;
	text-align:center!important;
	margin-bottom:40px;
}
/*プレビュー画像*/
.list-right img{
	width:80%;
	border-radius:20px;
	margin: 0 10%;
}
/*透かし*/
.water-mark{
	position:absolute;
	top:0%;
	left:0;
	width:100%;
	opacity: 0.5;
}
/*リセットボタン*/
.reset{
	background:#C1272D;
	border-radius:20px;
	padding:5px 10px;
	margin-top:30px;
	align:left;
	color:#fff;
	text-align:center;
	width:50%;
	clear:both;
	margin-bottom:0px;
	display:inline-block;
}
/*注文ボタン*/
.order{
background:#29ABFF;
	border-radius:20px;
	padding:5px 10px;
	align:left;
	color:#fff;
	text-align:center;
	width:50%;
	clear:both;
	margin-top:5px;
	display:inline-block;
}


/*完了ページ
--------------------------------------*/
.thankyou{
	text-align:center;
	padding:20% 0;
}
.thankyou img{
	width:50%;
}	

/*フッター アイコンなど　右側*/
.foot-sns{
	padding:0 10px;
	display:inline-block;
	vertical-align:middle;
	float:right;
}
.foot-sns img{
	height:30px;
	margin: 0 5px;
	float:right;
}
	

	
}


/*画面を横向きにした場合の高さが500px以下の場合の設定。
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (orientation: landscape) and (max-height:500px){


/*ヘッダー（一番上の、ロゴが入っているブロック）
---------------------------------------------------------------------------*/
	
/*トップ　左右分け*/	
#top-contents .top-left{
	width:40%;
	float:left;
	text-align: center;
		padding:3% 3% 0 7%;
	position: relative;
}
#top-contents .top-right{
	width:40%;
	float:right;
	text-align: center;
		padding:3% 7% 0 3%;
	position: relative;
}

/*下方スクロール
---------------------------------------------------------------------------*/
.arrow{
	display: block;
	width: 10%;	/*画像の幅*/
	position: absolute;
	left: 45%;		/*ロゴやメニューが入っているブロックに対して、左からの配置場所の指定。*/
	bottom: 5%;	/*ロゴやメニューが入っているブロックに対して、下からの配置場所の指定。*/
	text-align:center;
}	

	
/*完了ページ
--------------------------------------*/
.thankyou{
	text-align:center;
	padding:0% 0;
}
.thankyou img{
	width:20%;
}	

	
}


/*画面幅480px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px){
	
body {
	line-height: 1.2em;		/*行間*/
}
/*ヘッダー（一番上の、ロゴが入っているブロック）
---------------------------------------------------------------------------*/
header {
	height: 100%;
	overflow: hidden;
	position: relative;
}
	
/*トップ　左右分けのコンテンツ*/
#top-contents .top-left{
	width:80%;
	float:left;
	text-align: center;
		padding:12% 10% 0 10%;
	position: relative;
}
#top-contents .top-right{
	width:80%;
	float:left;
	text-align: center;
		padding:12% 10% 0 10%;
	position: relative;
}
	

/*下方スクロール
---------------------------------------------------------------------------*/
.arrow{
	display: block;
	width: 20%;	/*画像の幅*/
	position: absolute;
	left: 40%;		/*ロゴやメニューが入っているブロックに対して、左からの配置場所の指定。*/
	bottom: 10%;	/*ロゴやメニューが入っているブロックに対して、下からの配置場所の指定。*/
	text-align:center;
}

/*コンテナー（headerとfooterをのぞくブロックを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	font-size: 12px;
	font-size: 2.93vw;
}
	

/*h2 マーク　右寄せ*/
.r-image{
	clear:right;
	width:100%;
	text-align:center;
}
.r-image img{
	width:150px;
	margin-bottom:20px;
}
/*コンテンツ（上のcontainerの中のブロック）
---------------------------------------------------------------------------*/
/*コンテンツ内にあるh2(見出し)タグの指定*/
#contents h2 {
	font-size: 12px;	/*文字サイズ*/
	text-align:center;
	margin-bottom:0;
}
/*コンテンツ内にあるh3(見出し)タグの指定*/
#contents h3 {
	font-size: 14px;	/*文字サイズ*/
}

/*内側枠　ここで表示幅を指定
---------------------------------------------------------------------------*/
.inner{
	max-width: 1400px;	/*最大幅。これ以上広くならない指定。*/
	margin: 0 auto;
	/*overflow: hidden;*/
	padding: 10px 3%;
	clear:both;
}
	
	
/*各ブロックごとの設定*/
.list {
	width:100%;
	line-height: 1.5;
	padding: 10px 0 0 0;	/*ボックス内の余白*/
}
/*リセットボタン*/
.reset{
	background:#C1272D;
	border-radius:20px;
	padding:5px 10px;
	margin-top:20px;
	align:left;
	color:#fff;
	text-align:center;
	width:40%;
	clear:both;
	paddng-bottom:0px;
	display:inline-block;
}

	
	
/*スマホ時のプレビュー画像エリア*/	
.list-right{
	width:100%;
	aligh:left;
	display:inline-table;
	vertical-align:top;
	position:relative;
	text-align:center!important;
	margin-bottom:20px;
}
/*パーツセレクト　tab切り換え
---------------------------------------------------------------------------*/
/*---------- vertical tab nav */
#vertical_tab_nav{
  display: block;
  width: 100%;
}
#vertical_tab_nav ul{
  display: block;
  float: left;
  margin: 0px;
  padding: 0px;
  list-style: none;
  overflow: hidden;
  width: 25%;
  border-radius: 10px 0 0 10px;
  /*background: #555;*/
}
#vertical_tab_nav li{
  border-bottom: 1px solid #000;
  margin-bottom: 1px;
  text-align: left;
  padding: 0px;
}
#vertical_tab_nav li:last-child{
  margin-bottom: 0px;
  border-bottom: 0px;
}
#vertical_tab_nav li a{
  display: block;
  font-size: 8pt;
  color: #fff;
  text-decoration: none;
  padding: 12% 5%;
}
#vertical_tab_nav li a.selected{
  background: #fff;
  color: #000;
}


#vertical_tab_nav article{
  display: none;
  margin: 0px;
  color: #555;
  
}
#vertical_tab_nav div article p{
  margin: 0px 0px 20px 0px;
}

/*tabここまで*/


/*サムネイル*/
.sumbnail{
  display: flex;
  flex-wrap: wrap;
  background: #fff;
  width:67%;
  min-height: 250px;
  padding: 10% 4% 0;
  border-radius: 0 10px 10px 0;
}
.parts{
	width:33%;
	float:left;
	text-align:center;
	margin-bottom:0px;
}
.parts img{
	width:80%;
    margin:0 10%;
	background:#ccc;
}

/*ul.disc,olタグ
---------------------------------------------------------------------------*/
ul.disc {
	padding: 0 0px 20px 35px;
}
ol {
	padding: 0 0px 20px 35px;
}

/*その他
---------------------------------------------------------------------------*/
.ws {width: 96%;}
.big1 {font-size: 22px;letter-spacing: normal;}
.mb{display: inline;}/*幅480以下*/	

/*フォーム　テキスト入力*/
input[type="text"], textarea {
	width:90%;
	padding:5px;
	margin:0px;
	font-size:110%;
	/*display:block;*/
}	

/*背景
---------------------------------------------------------------------------*/	
.bg{
	background-image:url("../images/bg-logo.svg");
	background-repeat:no-repeat;
	background-position:center top 10%;
	background-size:80%;
}
	
	
	
/*完了ページ
--------------------------------------*/
.thankyou{
	text-align:center;
	padding:40% 0 80% 0;
}
.thankyou img{
	width:60%;
}	
	
/*フッター設定
---------------------------------------------------------------------------*/
footer {
	padding-top:0px;
}
	

}


/*画面幅380px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:380px){
	
/*コンテナー（headerとfooterをのぞくブロックを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	font-size: 11px;
	font-size: 2.93vw;
}	
	
/*コンテンツ（上のcontainerの中のブロック）
---------------------------------------------------------------------------*/
/*コンテンツ内にあるh2(見出し)タグの指定*/
#contents h2 {
	font-size: 10px;	/*文字サイズ*/
}
	
/*トップ　左右分けのコンテンツ*/
#top-contents .top-left{
	width:66%;
	float:left;
	text-align: center;
		padding:5% 17% 0 17%;
	position: relative;
}
#top-contents .top-right{
	width:66%;
	float:left;
	text-align: center;
		padding:10% 17% 0 17%;
	position: relative;
}
	
/*タブ　タイトル*/	
#vertical_tab_nav li a{
  display: block;
  font-size: 7pt;
  color: #fff;
  text-decoration: none;
  padding: 12% 5%;
}
	

}


/*画面幅330px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:330px){
	
/*コンテナー（headerとfooterをのぞくブロックを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	font-size: 10px;
	font-size: 2.0vw;
}	
	
/*コンテンツ（上のcontainerの中のブロック）
---------------------------------------------------------------------------*/
/*コンテンツ内にあるh2(見出し)タグの指定*/
#contents h2 {
	font-size: 8px;	/*文字サイズ*/
}

	
}