@charset "UTF-8";
/*
Theme Name: TITF
Theme URI: /2017/wp-content/themes/titf/
Description: Tokyo International Tap Festival Theme
Author: Coco-Factory
Version: 1.1
License: Coco-Factory
License URI: http://coco-factory.jp
*/

/* =common
-----------------------------------------------------------------------------*/


body{
	background:#000;
	color:#fff;
	font-size:14px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height:1.5;
	-webkit-text-size-adjust:none;
}

a{
	color:#fff;
	text-decoration:underline;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
	outline:none;
}
a:hover{
	color:#fff;
	text-decoration:none;
}

/* -----wp----- */

.aligncenter{
	display: block;
	clear: both;
	margin:0 auto;
	text-align:center;
}

.alignleft{
	float:left;
	margin:0 10px 10px 0;
}

.alignright{
	float:right;
	margin:0 0 10px 10px;
}


/* =responsive
-----------------------------------------------------------------------------*/

.iframe-area{ position:relative; padding-bottom:51%; padding-top:30px; margin:0 0 20px 0; height:0; overflow:hidden;}
.iframe-area iframe,.iframe-area object,.iframe-area embed{ position:absolute; top:0; left:0; width:100%; height:100%; }
.fb-like-box,.fb-like-box span, .fb-like-box iframe,.twtr-doc{background:#ccc; width: 100% !important;}
.widget-block,.widget-block iframe{width:100%!important;}

/* =outline
-----------------------------------------------------------------------------*/
.header{
	position: relative;
}

section.concept{
	width: 100%;
	background-color:#222;
	padding-bottom:60px;
}

section.concept h2,
#workshop h2{
	/*font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;*/
	font-size: 2.8em;
	padding: 1.2em 0;
	margin:0;
	text-align: center;
}


section.concept h2{
	padding: 2.2em 0;
}

section.concept .row{
	padding-bottom:0;
}


section.concept p{
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 1.1em;
color: #fff;
margin:0;
padding:0;
line-height: 1.8em;
}

.g-pic{
	width: 100%;
	height: auto;
}

#wrapper #top_img{
	width: 100%;
	height: auto;
}

#wrapper #top_img_mini{
	display: none;
}



.back{
	width: 100%;
	height: auto;
}

.box{
	margin:2em 0 4em;
}

.header h1{
	width: 90%;
	height: auto;
	position: absolute;
	top:4%;
	left:50%;
	transform:translate(-50%,0);
	animation-delay:1s; //1秒遅延して実行
	;}

#top_ws{
	width:50%;
	height: auto;
	max-width: 360px;
	min-width: 230px;
	position: absolute;
	top:40%;
	left:50%;
	transform:translate(-50%,0);
	animation-delay:2s; //2秒遅延して実行

}

/*

	.woman{
		width: 42%;
		max-width: 549px;
		height: auto;
		position: absolute;
		top:16%;
		left:58%;
		transform:translate(-100%,0);
		animation-delay:2s; //1秒遅延して実行
	}

	.man{
		width: 38%;
		max-width: 499px;
		height: auto;
		position: absolute;
		top:12%;
		left:48%;
		transform:translate(0%,0);
		animation-delay:2s; //1秒遅延して実行

	}

	*/



#wrapper #identity{
  width: 100%;
	height: auto;
}



/*見出しのかざり_h3のボーダー*/
h3{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 1.3em;
	position: relative;
	padding: 0.8em 0;
	margin: 0 0 20px;
}

 h3::before,
 h3::after {
	position: absolute;
	left: 0;
	content: '';
	width: 100%;
	height: 6px;
	box-sizing: border-box;
}

/*
h3::before {
	top: 0;
	border-top: 2px solid #515151;
	border-bottom: 1px solid #515151;
}
*/

h3::after {
	bottom: 0;
	border-top: 1px solid #515151;
	border-bottom: 2px solid #515151;
}

 .box .schedule{
	width: 100%;
	height: auto;
	max-width: 988px;
	margin: 0 auto;
}


h4{
	font-size: 1.2em;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	margin:15px 0 15px;
	text-align: center;
	line-height: 1.1em;
}

h4#place{
	text-align: left;
}

.instructor .leftcon img,
.instructor .rightcon img{
	width: 160px;
	height: auto;
	display: block;
	margin:30px auto;
}

.instructor .leftcon p.lane{
	color: #ffee8a;
}
.instructor .rightcon p.lynn{
	color: #feb2b8;
}

.instructor .leftcon span.tb{
	display: block;
	border-left: solid #ffee8a 4px;
	padding-left:1em;
	margin:20px 0 20px;
}

.instructor .rightcon span.tb{
	display: block;
	border-left: solid #feb2b8 4px;
	padding-left:1em;
	margin:20px 0 20px;
}




/*****見出しの飾り*****/
.row{
	width:100%;
	max-width:988px;
	margin:0 auto 50px auto;
	overflow:hidden;
}

.instructor .leftcon,
.instructor .rightcon{
	margin-bottom:50px;
}

.row p{
	margin:0 0 10px 0;
}

.row p.cancel{
	margin:0 0 40px 0;
}

.instructor p{
	margin:14px 0 14px;
}

.heading01{
	margin:0 0 20px 0;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:26px;
	text-align:center;
	letter-spacing:0.2em;
}

.heading02{
	margin:0 0 20px 0;
	padding:5px 0 5px 2%;
	background:url("http://titf.jp/2015/wp-content/themes/titf/img/bg_hl_l.png") no-repeat left;
	/*font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;*/
	font-size:22px;
	color:#000;
	letter-spacing:0.2em;
}

.heading02a{
	margin:20px 0;
	padding:5px 0 5px 2%;
	background:url("http://titf.jp/2015/wp-content/themes/titf/img/bg_hl.png") no-repeat left;
	/*font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;*/
	font-size:18px;
	color:#000;
	letter-spacing:0.2em;
}

.heading03{
	margin:0 0 10px 2%;
	color:#fff;
	font-size:18px;
	letter-spacing:0.2em;
	/*font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;*/
}

.heading04{
	width: 100%;
	height: auto;
	margin:0;
	padding: 10px 0;
	background-color: #000;
	text-align:center;
}


.leftcon,
.rightcon{
	margin-bottom: 30px;
}

#map{
	margin:10px 0 10px;
}


.heading05{
	margin:0 0 20px 0;
	font-size:18px;
	/*font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;*/
}

.heading05 span{
	font-size:14px;
}

.heading06{
	margin:0 0 20px 0;
	text-align:center;
	color:#000;
	font-size:25px;
	/*font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;*/
}

.heading07{
	margin:20px 0  20px 0;
	color:#fff;
	text-align:center;
	font-size:25px;
	/*font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;*/
}

nav{
	margin:0 0 60px 0;
}

nav ul{
	text-align:center;
}

nav ul li{
	display:inline;
	margin:0 1%;
}

nav ul li:hover{
	opacity:0.8;
}

.leftcon{
	float:left;
	width:48%;
}

.rightcon{
	float:right;
	width:48%;
}

.rightcon figure{
	text-align:center;
}

#concept{
	background:url("http://titf.jp/2015/wp-content/themes/titf/img/bg_black.png");
	padding:20px 0;
	marin:0 0 50px 0;
	line-height:2;
}

#concept p{
	margin:0 0 20px 0;
}

.right{
    float: right;
    font-size: 1.1em;
}

.pict{
	margin:0 0 20px 0;
	text-align:center;
}

.pict02{
	float:left;
	margin:0 10px 10px 0;
}

.attention li{
	list-style:disc;
	margin:0 0 20px 2em;
}

.graybox{
	background:#ccc;
	padding:20px;
	color:#000;
}

.graybox a{
	color:#000;
}

.graybox dl{
	margin:0 0 20px 0;
	overflow:hidden;
}

.graybox dt{
	float:left;
	width:70px;
	border:2px solid #333;
	background:#fff;
	text-align:center;
}

.border-box{
	clear:both;
	border-top:1px solid #ccc;
	border-right:1px solid #ccc;
	border-left:1px solid #ccc;
	padding:10px 2% 0 2%;
	margin:20px 0 50px 0;
}

.graybox dd{
	margin:0 0 0 70px;
	padding:0 0 0 20px;
}

.row p.st,
.row .border-box p,
.row .graybox p,
#sp{
	margin:0 0 20px 0;
}

.price{
	font-size:20px;
	font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-weight:bold;
}

.wsarea{
	background:url("/2017/wp-content/themes/titf/img/bg_form.gif") no-repeat center top;
	background-size:cover;
	color:#000;
	padding:20px 0;
}

.wsarea #wsarea{
	margin: 40px 0 60px 0;
	text-align: center;
}

#ws_pct{
	width: 100%;
	height: auto;
}

.font-red{
	color:#f00;
	text-align:center;
}

.bgwhite{
	background:url("http://titf.jp/2015/wp-content/themes/titf/img/bg_white.png");
	padding:2%;
}

#contact{
	padding:30px 0 0 0;
	margin:0 0 50px 0;
}

.telfax{
	text-align:center;
	font-size:25px;
	margin:0 0 20px 0;
}

.telfax span{
	background:#000;
	padding:14px;
	font-size: 0.9em;
}

footer p{
	text-align:right;
	margin:50px 2% 20px 0;
}

footer dl{
	text-align:center;
	margin:0 0 20px 0;
}

footer dl dt,
footer dl dd{
	display:inline;
	padding:0 10px 0 0;
}

small{
	display:block;
	text-align:center;
}

/* =contact
-----------------------------------------------------------------------------*/
.open{
	display: inline-block;
	font-size: 1.2em;
	border: solid #e02d2d 1px;
	padding: 10px;
	margin-top: 20px;
}




}
.contact-form ol{
	margin:20px 0 0 0;
	overflow:hidden;
}

.contact-form li{
	background:url("http://titf.jp/2014/wp-content/themes/titf/common/img/icon_c_red.png") no-repeat left 0.3em;
	padding:0 0 0 15px;
	margin:0 0 15px 0;
	overflow:hidden;
	width:46%;
	float:left;

}

.contact-form li.contactarea{
	width:100%;
	float:none;
	clear:both;
}

.contact-form li label{
	display:block;
	margin:0 0 5px 0;
}

.contact-form li input{
	width:90%;
	height:20px;
}

.contact-form li input#sum,
.contact-form li input#psum,
.contact-form li input#stagesum,
.contact-form li input#address,
.contact-form li input#address02{
	width:30%;
}

.contact-form li input#address03{
	margin:10px 0 0 0;
}

.contact-form li textarea{
	width:94%;
	height:140px;
	font-size:14px;
}

p.submit-btn,
.description-content p.submit-btn{
	text-align:right;
	margin:0 10px 20px 0;
}

.submit-btn input{
	padding:5px 10px;
	cursor:pointer;
}

.wpcf7-checkbox label{
	cursor:pointer;
	display:block;
	padding:5px 0;
}

.ws-table02,
.ws-table03{
	margin:0 0 40px 0;
	width:99%;
}

.ws-table02 thead,
.ws-table03 thead{
	font-size:1.3em;
}

.ws-table02 tbody,
.ws-table03 tbody{
	background:#fff;
	text-align:center;
	border-right:1px solid #aaa;
}

.ws-table02 tbody th,
.ws-table03 tbody th{
	background:#515151;
	color:#fff;
	vertical-align:middle;
	padding:5px 1%;
	width:10%;
}

.ws-table02 tbody tr.odd th,
.ws-table03 tbody tr.odd th{
	background:#3d3d63;
}


.ws-table02 tbody td,
.ws-table03 tbody td{
	padding:0 0 10px 0;
	width:40%;
	border:1px solid #aaa;
}

.ws-table03 tbody td{
	width:30%;
}

.ws-table03.pt02 tbody td{
	width:90%;
}

.ws-table02 span.bg-bk,
.ws-table03 span.bg-bk{
	background:#ccc;
	display:block;
	padding:5px 2%;
}

.ws-table02 tr.odd span.bg-bk ,
.ws-table03 tr.odd span.bg-bk {
	background:#c6c6f4;
}

.total{
	text-align:right;
}

.total input{
	width:150px;
	height:25px;
}

.total span.font-s{
	margin:10px 0;
	display:block;
}

.wpcf7-list-item-label{
	padding:0;
	display:block;
}

.sns{
	text-align: center;
	margin: 40px 0;
}

.sns img{
	margin:0 10px 0;
}

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

.row{
	width:96%;
}

#identity img{
	width:90%;
	height:auto;
}


.heading01{
	font-size:20px;
}

#wrapper{
	background-size:contain;
}

#top_ws{
	top:42%;
}
}

@media only screen and (max-width:830px){
nav ul li img{
		width:300px;
		height:auto;
}


}

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

	.row{
		margin:0 auto 10px auto;
	}


.leftcon,
.rightcon{
	float:none;
	width:auto;
	margin:0 0 20px 0;
}

.contact-form li.contactarea{
	float:none;
}

.contact-form li{
	width:90%;
}

p.submit-btn,
.description-content p.submit-btn{
	text-align:center;
	margin:0 0 20px 0;
}
.ws-table02,
.ws-table03{
	width:97%;
}

}

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

	section.concept h2,
	#workshop h2{
		/*font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;*/
		font-size: 1.6em;
		padding: 1.2em 0 0.8em;
	}

	#wrapper #top_img{
				display: none;
	}

	#wrapper #top_img_mini{
		display: block;
		width: 100%;
		height: auto;

	}

.header h1{
		top:10px;
	}

nav ul li{
	display:block;
	margin:0 0 20px 0;
}

.ws-table02 thead,
.ws-table03 thead{
	font-size:12px;
}

.ws-table02 tbody th{
	font-size:16px;
}


.ws-table02 thead td,
.ws-table02 tbody th,
.ws-table03 thead td,
.ws-table03 tbody th{
	display:none;
}

.heading04 img{
	max-width:60%;
	height:auto;
	margin:0 auto;
}

.heading06,
.heading07{
	font-size:20px;
	margin:16px 0 24px;
}

.telfax{
	font-size:16px;
}

.contact-form li{
	padding:0 0 0 4%;
}

}