/* =================================================================== */
/* 
/*  Puremedia v1.0 Media Queries
/*  url:styleshout.com
/*  10-10-2014
/*
/* =================================================================== */

@media screen and (min-width:600px) {

a, a:visited {
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

}

/* small screens */
@media only screen and (max-width:1100px) {

ul#nav li a {
	padding: 20px 20px 0 0;
}

#schedule #schedulebx .scheachy{
width:90%;
margin:0 auto;
}

#abmain #abcomment{
background:url(../../images/about/mainimg.jpg) 5% bottom no-repeat;
-webkit-background-size: 179px auto;
-moz-background-size: 179px auto;
background-size: 179px auto;
max-width:1162px;
margin:0 auto;
}

#contactform #selecttype{
font-size:1.2rem;
width:80%;
}

#contactform #selecttype input[type="radio"]:checked + .swift-on {
	font-size:1.3rem;
}

#contactform #selecttype input[type="radio"]:checked + .swift-off {
	font-size:1.3rem;
}

#contactform .ticketcom{
width:60%;
}


}/* 1100 */



/* small screens */
@media only screen and (max-width:950px) {
 
#main-header{
	-webkit-background-size: auto 80px;
	-moz-background-size: auto 80px;
	background-size: auto 80px;
}


#main-header .logo {
	width:140px;
}

#main-header .logo a {
	padding-left:140px;
	padding-top:80px;
	background-position: left 12px;
}

#main-header.fixed .logo a {
padding-left:140px;
padding-top:50px;
background-position: left 5px;
}

#mainnav ul#nav {
top:28px;
}

#main-header.fixed ul#nav {
top:20px;
}

#mainnav ul#nav li.nm img{
height:10px;
width:auto;
}

#mainnav ul#nav li.social img{
height:30px;
width:auto;
}

ul#nav li a {
	padding: 10px 20px 0 0;
}



#hero #mainimg{
background: url(../../images/top/bg.jpg) center 70px no-repeat #d1c5c9;
-webkit-background-size: 100% auto;
-moz-background-size: 100% auto;
background-size: 100% auto;
}

#hero #mainimg .hrcp{
padding-top:40%;
padding-bottom:10%;
}

#hero #mainimg .hrcp img{
width:35%;
max-width:380px;
height:auto;
}

#pickup #pickuplist li .pickimg{
width:40%;
max-width:195px;
height:auto;
}

#pickup #pickuplist li .pickright{
font-size:1.3em;
margin:0 0 0 45%;
}

#pickup #pickuplist li .picknom{
font-size:1.3em;
margin:0;
}

.cont-head{
padding-top:70px;
}

#schedule #schedulebx .scheachy ul .sche dt{
font-size:2em;
}

#schedule #schedulebx .scheachy ul .sche .schedate{

font-size:2em;
}


#schedule #schedulebx .scheachy ul .sche .hall{
font-size:1.8em;
}

#contactbx{
padding:50px 0 0 0;
}

#contactform .ticketcom{
width:80%;
}


}/* 950 */


/* xsmall screens */
@media only screen and (max-width:880px) {

#hero #intro p{
width:90%;
max-width:932px;
margin:0 auto;
padding:20px 30px;
font-size:1.5em;
letter-spacing:1px;
line-height:1.8;
}

.ih-item.square.effect6 .info h3 {

  margin: 10% 0 0 0;
}

#abmain #abcomment{
background:url(../../images/about/mainimg.jpg) 0 bottom no-repeat;
-webkit-background-size: 20% auto;
-moz-background-size: 20% auto;
background-size: 20% auto;
max-width:1162px;
margin:0 auto;
}

#abmain #abcomment p{
margin:0;
padding:1% 0 1% 20%;
font-size:1.4em;
}

#artistd #ardinfo .ardtx{
font-size:1.4em;
line-height:1.8;
padding:0 3% 2% 3%;
letter-spacing:1px;
}

#contactbx #ctccmt p{
font-size:1.4em;
}


#contactbx #ctccmt dl dt{
font-size:2em;
}

#contactbx #ctccmt dl dd{
font-size:1.8em;
}

#contactform #selecttype{
font-size:1.2rem;
width:80%;
}

#contactform #selecttype input[type="radio"]:checked + .swift-on {
	font-size:1.2rem;
}

#contactform #selecttype input[type="radio"]:checked + .swift-off {
	font-size:1.2rem;
}

#contactform .tickettx{
font-size:1.6em;
}

#contactform .ticketcom{
font-size:1.3em;
width:90%;
}

.formBox li.twf{
padding:10px 0;
}

} /* 880 */




/* tablets */
@media only screen and (max-width:768px) {


#hero #mainimg{
background: url(../../images/top/bg.jpg) center 50px no-repeat #d1c5c9;
-webkit-background-size: 100% auto;
-moz-background-size: 100% auto;
background-size: 100% auto;
}



/* mobile navigation */
#main-header{
z-index: 999;
width:100%;
top:0;
position:fixed;
margin:0 auto;
padding:0;
background: #e8ded4;
}



#main-header .head-inner{
width:100%;
}

#main-header .logo {
	float:none;
	width:143px;
	margin:0 0 0 10px;
	padding:0;
}

#main-header .logo a {
	display:block;
	height:0;
	padding-left:143px;
	padding-top:56px;
	width:0;
	background-image:url("../../images/header_logo.png");
	background-position: left 3px;
	background-repeat:no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	background-size: contain;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	overflow:hidden;
}

#main-header .logo a:hover {
	-webkit-transform:none;
	-moz-transform:none;
	-ms-transform:none;
	-o-transform:none;
}

#main-header.fixed {
background: rgba(232,222,212,.7);
padding:0;
}


#mobile-head {
width:100%;
height:56px;
z-index:999;
position:relative;
}

#main-header.fixed .logo a {
padding-left:143px;
padding-top:56px;
width:0;
background-position: left 3px;
}



#mainnav{
z-index:800;
position:absolute;
top:-500px;
width:100%;
text-align:center;
padding:0;
margin:0
-webkit-transition: .3s ease-in-out;
-moz-transition: .3s ease-in-out;
transition: .3s ease-in-out;
background: #d9ccbf;
}


#mainnav:before, #mainnav:after {
	content: "";
	display: table;
}
#mainnav:after {
	clear: both;
}

#mainnav ul#nav {
list-style:none;
padding:0;
margin:0;
position:static;
}

#mainnav ul#nav li{
float:none;
position:static;
}

#mainnav ul#nav .nm{
font-size:1.6em;
font-family: 'Droid Serif', serif;
}

#mainnav ul#nav .nm a{
color:#6d6258;
padding:18px 0;
border-bottom:1px solid #e8ded4;
}

#mainnav ul#nav .nm a:hover{
color:#ffffff;
background:#beae9d;
}

#mainnav ul#nav .social{
display:inline-block;
padding:20px 10px;
}

#mainnav ul#nav li .pcnv{
display:none;
}

#mainnav ul#nav li .mnv{
display:block;
}

#main-header.fixed ul#nav li a {
	padding: 18px 0;
}

#main-header.fixed ul#nav .social a {
padding:0px 5px;
}

#main-header,
#main-header:after,
#main-header .logo,
#mainnav ul#nav li,
#mainnav ul#nav li a,
#mainnav ul#nav .social
#mainnav ul#nav .social a, {
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}


#main-header #mainnav ul#nav li a,
#main-header.fixed #mainnav ul#nav li a{
width:100%;
display:block;
}



#nav-toggle{
display:block;
}

.open #nav-toggle span:nth-child(1){
top:11px;
-webkit-transform: rotate(315deg);
-moz-transform: rotate(315deg);
transform: rotate(315deg);
}
.open #nav-toggle span:nth-child(2){
width:0;
left:50%;
}
.open #nav-toggle span:nth-child(3){
top:11px;
-webkit-transform: rotate(-315deg);
-moz-transform: rotate(-315deg);
transform: rotate(-315deg);
}
.open #mainnav{
-moz-transform: translateY(556px);
-webkit-transform: translateY(556px);
transform: translateY(556px);
}

.cont-head{
padding-top:50px;
}

#schedule #schedulebx .scheachy ul .sche dl.art01,#schedule #schedulebx .scheachy ul .sche dl.art02,#schedule #schedulebx .scheachy ul .sche dl.art03,#schedule #schedulebx .scheachy ul .sche dl.art04{
-webkit-background-size: 15% auto;
-moz-background-size: 15% auto;
background-size: 15% auto;
}

#schedule #schedulebx .scheachy ul .sche dt{
font-size:1.7em;
padding:15px 10px 10px 45%;
}

#schedule #schedulebx .scheachy ul .sche .schedate{
padding:10px 10px 10px 20%;
font-size:1.7em;
}



#schedule #schedulebx .scheachy ul .sche .hall{
font-size:1.5em;
padding:0 0 0 45%;
}

#schedule #schedulebx .scheachy ul .sche .price{
font-size:1.3em;
padding:5px 0 5px 45%;
}

#schedule #schedulebx .scheachy ul .sche .appe{
font-size:1.3em;
padding:10px 10px 10px 45%;
}

#schedule #schedulebx .scheachy ul .sche .program{
font-size:1.3em;
padding:10px 10px 10px 45%;
}

#schedule #schedulebx .intro{
font-size:1.4em;
font-weight:bold;
padding:0 10px 10px 45%;
}

#schedule #schedulebx .scheachy ul .sche .detail{
font-size:1.4em;
margin:10px 0 0 45%;
}

#schedule #schedulebx .ticketbox{
font-size:1.3em;
font-weight:bold;
padding:0 0 5px 45%;
}

#schedule #schedulebx .ticketbox ul li a{
font-size:1.1em;
}


#abmain #abcomment p{
margin:0;
padding:1% 5% 1% 20%;
font-size:1.3em;
}
#abmain #abcomment p br.mbt{
display:none;
}

#abinfo dl{
width:90%;
margin:5% auto 0 auto;
padding:0;
font-size:1.4em;
line-height:1.8;
}

#artistd #ardmain .arslide_all{
width:100%;
max-width:480px;
min-height:206px;
position:relative;
}

#artistd #ardmain .arslide_wrap{
width:1440px;
position:absolute;
left:50%;
margin-left:-720px;
}

#artistd #ardmain .arslide{
width:100%;
max-width:480px;
}

#contactbx #ctccmt p{
width:90%;
margin:0 auto;
font-size:1.3em;
}


#contactbx #ctccmt dl dt{
font-size:2em;
}

#contactbx #ctccmt dl dd{
font-size:1.8em;
}

#contactform #selecttype{
font-size:1.2rem;
width:80%;
}

#contactform #selecttype input[type="radio"]:checked + .swift-on {
	font-size:1.2rem;
}

#contactform #selecttype input[type="radio"]:checked + .swift-off {
	font-size:1.2rem;
}

#contactform .tickettx{
font-size:1.6em;
}

#contactform .ticketcom{
font-size:1.3em;
width:90%;
}

.formBox{
width:100%;
}

.formBox li.twf dl{
width:80%;
margin:0 auto;
}

.formBox li.twf{
padding:10px 0;
}

.formBox li.twf dt{
width:100%;
float:none;
text-align:left;
padding-top:0.5%;
padding-bottom:1%;
padding-right:0px;

}

.formBox li.twf dd{
width:100%;
float:none;
padding-left:2%;
}

.contactButton{
width:100%;
}

#btn1 { 
width: 50%; 
}


} /* 768 */


/* mobiles */
@media only screen and (max-width:600px) {

#hero #intro p{
width:90%;
max-width:932px;
margin:0 auto;
padding:1% 0;
font-size:1.3em;
letter-spacing:1px;
line-height:1.8;
}

#hero #intro p.introt{
background:none;
}

#hero #intro p.introb{
background:none;
}

#pickup h2 img{
max-width:479px;
height:auto;
width:80%;
}

#pickup #pickuplist li{
border:1px solid #ccc;
padding:10px;
width:95%;
text-align:left;
}

#pickup #pickuplist .pickright .pikckti{
height:auto;
width:40%;
}

#pickup #pickuplist .picknom .pikckti{
height:auto;
width:20%;
}

#artist #artistlist li{
display:inline-block;
width:90%;
padding:0;
margin:3px;
background:#eee;
}

.ih-item.square .info {
display:none;
}

.ih-item.square.effect6 a:hover .img {
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
}

#artist .artcm{
margin:0 auto;
width:90%;
padding:10% 0;
font-size:1.3em;
letter-spacing:1px;
line-height:1.8;
}

/* 
/* snssection(article)
/* =================================================================== */
#snssection {
width:90%;
margin:2% auto;
}

#snssection:before, #snssection:after {
	content: "";
	display: table;
}
#snssection:after {
	clear: both;
}

/* 
/* facebook Section
/* =================================================================== */
#facebooksection {
width:100%;
margin-left:0;
float:none;
}

/* 
/* twitter Section
/* =================================================================== */
#twittersection {
width:100%;
float:none;
margin-left:0;
margin-top:5%;
}

#schedule #schedulebx{
padding:3% 0 0 0;
}

#schedule #schedulebx .scheachy .year{
font-size:3em;
}

#schedule #schedulebx .scheachy ul .sche dl.art01,#schedule #schedulebx .scheachy ul .sche dl.art02,#schedule #schedulebx .scheachy ul .sche dl.art03,#schedule #schedulebx .scheachy ul .sche dl.art04{
-webkit-background-size: 20% auto;
-moz-background-size: 20% auto;
background-size: 20% auto;
}

#schedule #schedulebx .scheachy ul .sche dt{
font-size:2em;
padding:2em 10px 10px 25%;
}

#schedule #schedulebx .scheachy ul .sche .dtmani dt{
font-size:2em;
padding:3em 10px 10px 25%;
}

#schedule #schedulebx .scheachy ul .sche .schedate{
font-size:1.8em;
padding:10px 10px 10px 25%;
text-align:left;
}

#schedule #schedulebx .scheachy ul .sche .dtmani .schedate {
	font-size:1.4em;
	padding-bottom:1em;
}

#schedule #schedulebx .scheachy ul .sche .dtmani .schedate .pc{
	display:none;
}



#schedule #schedulebx .scheachy ul .sche .schedate .time{
position:absolute;
top:12px;
right:-6em;
font-size:0.8em;
padding:0;
}

#schedule #schedulebx .scheachy ul .sche .dtmani .schedate .time{
	position:static;
}

#schedule #schedulebx .scheachy ul .sche .hall{
font-size:1.6em;
padding:0 0 0 25%;
}

#schedule #schedulebx .scheachy ul .sche .price{
font-size:1.6em;
padding:5px 0 5px 25%;
}

#schedule #schedulebx .scheachy ul .sche .appe{
font-size:1.6em;
padding:10px 10px 10px 25%;
}

#schedule #schedulebx .scheachy ul .sche .program{
font-size:1.6em;
padding:10px 10px 20px 25%;
}

#schedule #schedulebx .intro{
font-size:1.4em;
font-weight:bold;
padding:0 10px 10px 25%;
}

#schedule #schedulebx .scheachy ul .sche .detail{
color:#000000;
font-size:1.6em;
padding:10px 20px 10px 20px;
margin:10px 0 0 25%;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
background:#f4a672;
}

#schedule #schedulebx .ticketbox{
font-size:1.4em;
font-weight:bold;
padding:0 0 5px 25%;
}

#service #servicecom{
width:90%;
margin:0 auto;
}

#service #servicecom p{
font-size:1.4em;
}

#abmain #abcomment p{
margin:0;
padding:1% 3% 1% 25%;
font-size:1.2em;
text-align:left;
}



#abinfo dl{
font-size:1.3em;
line-height:1.8;
}

#abinfo dl dt{
display:block;
width:20%;
}

#abinfo dl dd{
display:block;
width:80%;
}

#recruit #recruitdt p{
font-size:1.6em;
}

#artistd #ardinfo h2{
font-size:3em;
}

#artistd #ardinfo .subart{
font-size:2em;
}

#artistd #ardinfo .art{
font-size:2em;
}

#artistd #ardinfo h3{
font-size:2em;
}

#artistd #ardinfo .ardtx{
font-size:1.3em;
letter-spacing:0px;
padding:0 5% 2% 5%;
}

#artistd #ardinfo .sugasis_a .sugabx_a{
padding:12% 0 3% 5%;
}

#artistd #ardinfo .sugasis_b .sugabx_b{
padding:12% 5% 3% 5%;
}

#artistd #ardinfo .sugasis_a, #artistd #ardinfo .sugasis_b{
font-size:2em;
}

#artistd #ardinfo .sugasis_a h3, #artistd #ardinfo .sugasis_b h3{
font-size:1.3em;
}

#artistd #ardinfo .ardtx .pc{
  display:none;
}


#contactform .tickettx{
width:90%;
margin:0 auto;
font-size:1.4em;
}

#contactform .ticketcom{
font-size:1.3em;
width:100%;
border:none;
padding:2% 8% 2% 8%;
}

.formBox{
width:100%;
}

.formBox li.twf dl{
width:80%;
margin:0 auto;
}

.formBox li.twf{
padding:10px 0;
}

.formBox li.twf dt{
width:100%;
float:none;
text-align:left;
padding-top:0.5%;
padding-bottom:1%;
padding-right:0px;

}

.formBox li.twf dd{
width:100%;
float:none;
padding-left:2%;
}

.formBox .fm50{width:20%;}
.formBox .fm80{width:35%;}
.formBox .fm150{width:70%;}
.formBox .fm250{width:90%;}

.contactButton{
width:100%;
}

#btn1 { 
width: 60%; 
}

} /* 600 */


/* small small mobiles */
@media only screen and (max-width:480px) {

footer {
	padding: 50px 0 20px 0;
	position: relative;
	background:#f1efe7;
}

footer .copyright {
	margin: 0;
	padding-top:20%;
	clear: both;
	text-align:center;
	font-size:1.1em;
	background: url(../../images/footer_logo.png) center top no-repeat;
	-webkit-background-size: 50% auto;
	-moz-background-size: 50% auto;
	background-size: 50% auto;
letter-spacing:1px;
}

/* back to top */
footer #go-top {
height:0;
}
footer #go-top .totop a {
	display: none !important;
	height:0px;
}



#schedule #schedulebx .scheachy ul .sche dt{
font-size:1.6em;
padding:2.5em 10px 10px 25%;
}

#schedule #schedulebx .scheachy ul .sche .schedate{
font-size:1.4em;
padding:10px 10px 10px 25%;
text-align:left;
}

#schedule #schedulebx .scheachy ul .sche .schedate .time{
position:absolute;
top:12px;
right:-6em;
font-size:0.8em;
padding:0;
}

#schedule #schedulebx .scheachy ul .sche .hall{
font-size:1.4em;
padding:0 0 0 25%;
}

#schedule #schedulebx .scheachy ul .sche .price{
font-size:1.4em;
padding:5px 0 5px 25%;
}

#schedule #schedulebx .scheachy ul .sche .appe{
font-size:1.4em;
padding:10px 10px 10px 25%;
}

#schedule #schedulebx .scheachy ul .sche .program{
font-size:1.4em;
padding:10px 10px 20px 25%;
}

#schedule #schedulebx .scheachy ul .sche .detail{
color:#000000;
font-size:1.4em;
padding:10px 20px 10px 20px;
margin:10px 0 0 25%;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
background:#f4a672;
}

#service #servicecom p{
font-size:1.3em;
}

#abmain #abcomment{
background:url(../../images/about/mainimg.jpg) 50% bottom no-repeat;
-webkit-background-size: 40% auto;
-moz-background-size: 40% auto;
background-size: 40% auto;
margin:0 auto;
padding-bottom:60%;
}

#abmain #abcomment p{
margin:0;
padding:1% 8%;
font-size:1.2em;
line-height:1.8;
letter-spacing:2px;
font-weight:bold;
}

#artistd #ardmain .arslide_all{
width:100%;
max-width:320px;
min-height:138px;
position:relative;
}

#artistd #ardmain .arslide_wrap{
width:960px;
position:absolute;
left:50%;
margin-left:-480px;
}

#artistd #ardmain .arslide{
width:100%;
max-width:320px;
}

#artistd #ardinfo h2{
font-size:2.8em;
}

#artistd #ardinfo .art{
font-size:1.8em;
}

#artistd #ardinfo h3{
font-size:1.7em;
letter-spacing:0px;
}

#artistd #ardinfo .ardtx{
font-size:1.3em;
text-align:left;
padding:0 8% 2% 8%;
}

#artistd #ardinfo .sugasis_a .sugabx_a{
padding:8% 0 1% 5%;
}

#artistd #ardinfo .sugasis_b .sugabx_b{
padding:8% 5% 1% 5%;
}

#artistd #ardinfo .sugasis_a, #artistd #ardinfo .sugasis_b{
font-size:1.6em;
}

#artistd #ardinfo .sugasis_a h3, #artistd #ardinfo .sugasis_b h3{
font-size:1.3em;
padding:0;
margin:0;
}


#artist .artbx p{
font-size:1.2em;
}

} /* 480 */


@media only screen and (max-width:460px) {



} /* 460 */


@media only screen and (max-width:420px) {



} /* 420 */


@media only screen and (max-width:400px) {

#pickup #pickuplist .pikckti{
height:auto;
width:50%;
}
#abmain #abcomment p{

line-height:1.8;
letter-spacing:0px;
font-weight:bold;
}

#abinfo dl{

font-size:1.2em;
line-height:1.8;
}

#abinfo dl dt{
display:block;
width:25%;
}

#abinfo dl dd{
display:block;
width:75%;
}

#contactbx #ctccmt dl dt{
font-size:1.8em;
letter-spacing:0;
}

#contactbx #ctccmt dl dd{
font-size:1.4em;
}

#contactform #selecttype{
font-size:0.8rem;
width:90%;
margin:2% auto 4% auto;
}

#contactform #selecttype input[type="radio"]:checked + .swift-on {
	font-size:0.8rem;
}

#contactform #selecttype input[type="radio"]:checked + .swift-off {
	font-size:0.8rem;
}

#contactform .tickettx{
padding:0 0 5% 0;
width:80%;
margin:0 auto;
font-size:1.3em;
}

#contactform .ticketcom{
font-size:1.2em;
width:100%;
letter-spacing:0px;
padding:5% 8% 5% 8%;
}

#contactform .ticketcom dt{
padding:0 0 5px 0;
margin:0;
font-weight:bold;
font-size:1.1em;
text-align:left;
}

} /* 400 */


