﻿@import "reset.css";
@charset "UTF-8";

*, 
*:before, 
*:after { 
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box; 
} 

body {
color: #060606;
font-family: sans-serif;
text-align: justify;
text-justify: distribute;
border-top: 5px #0080ff solid;
}
body .container {
max-width: 1000px;
margin: 0 auto;
background: #ffffff;
}

a {
color: #0000ff;
text-decoration: underline;
}
a:hover {
color: #aaaa00;
text-decoration: none;
}

.pc {display: block;}
.mb {display: none;}

h1 {
padding: 15px 0 5px;
font-size: 85%;
text-align: right;
letter-spacing: 0.2em;
}


header {
float: left;
width: 25%;
padding: 0 20px 0 0;
}
header img {
margin: 0 0 5px 0;
max-width: 100%;
border-radius: 5px;
}



#main {
float: right;
width: 75%;
}
#main #top-image img {
width: 100%;
}


#side {
float: left;
width: 25%;
padding: 30px 20px 0 0;
}



#menu li a{
display: block;
width: 100%;
margin: 0 0 5px 0;
padding: 12px 0 10px;
background: #006ad5;
background: linear-gradient(#2b95ff,#006ad5);
border: 3px #80bfff double;
border-radius: 5px;
font-size: 95%;
color: #ffffff;
text-align: center;
text-decoration: none;
}
#menu li.active a,
#menu li a:hover{
background: #2b95ff;
color: #ffff00;
}
#toggle{ 
display: none;
}



#page-title {
padding: 40px ;
background: url(page-title.png);
background-repeat: no-repeat;
background-position: right top;
}
#page-title h2 {
letter-spacing: 0.2em;
font-size: 150%;
font-weight: bold;
}


#main section {
padding: 30px 0 30px 20px;
}
#main section .h3wrap {
margin: 0 0 20px 0;
padding: 5px;
border: 1px #c9c9c9 solid;
border-radius: 5px;
background: linear-gradient(#ffffff,#eeeeee);
}
#main section h3 {
padding: 8px 10px 3px 13px;
border-left: 5px #7272e2 solid;
font-size: 100%;
font-weight: bold;
color: #363636;
}
#main section h4 {
padding: 0 10px 10px 10px;
font-weight: bold;
color: #363636;
}
#main section p {
padding: 0 0 0 30px;
line-height: 150%;
font-size: 95%;
}


#main section#top h2 {
font-size: 150%;
padding: 10px 0 30px 0;
}
#main section#top h2.pc {
display: block;
}
#main section#top h2.mb {
display: none;
}
#main section#top p {
font-size: 100%;
}

#main section#new dt {
float: left;
margin: 10px 20px 0 15px;
padding: 8px 10px 5px 10px;
background: #aad5ff;
border-radius: 7px;
color: #002b55;
}
#main section#new dt.takasa {
margin:10px 20px 30px 15px;
}
#main section#new dt.takasa2 {
margin:10px 20px 380px 15px;
}
#main section#new dd {
padding: 15px 0 8px;
border-bottom: 1px #c0c0c0 dotted;
line-height: 130%;
}
#main section#new dd span {
color: #f00000; 
font-size: 110%;
}
#main section#new dd.pc {
display: block;
}
#main section#new dd.mb {
display: none;
}

#main section#new img {
width: 100%;
margin: 30px 0 0;
border: 1px #d4d4d4 solid;
}


#main section#magazine p {
text-align: center;
color: #2b80d5;
font-weight: bold;
font-size: 160%;
}
#main section#magazine img {
display: block;
margin: 0 auto;
width: 60%;
}





#main section#iten {
margin: 0 0 0 20px;
padding: 20px 10px 40px;
border: 1px #d4d4d4 solid;
}
#main section#iten h3 {
padding: 10px 0 10px 10px;
border-left: 0px #7272e2 solid;
font-size: 140%;
}
#main section#iten h4 {
padding: 20px 0 0 30px;
}






#main section#taiken img {
width: 100%;
margin: 0;
border: 1px #d4d4d4 solid;
border-radius: 20px;
}




#main section#kyoushitsu dl {
margin: 0 0 15px 15px;
padding: 0 0 15px 0;
border-bottom: 0px #e4e0da solid;
}
#main section#kyoushitsu dt {
float: left;
margin: 10px 20px 10px 20px;
padding: 10px 15px 8px 10px;
font-size: 120%;
background: #d5ffff;
border-radius: 5px;
}
#main section#kyoushitsu dd {
padding: 13px 0 0 170px;
line-height: 130%;
}
#main section#kyoushitsu img {
margin: 10px 0 0;
}

#main section img.pc {
display: block;
}
#main section img.mb {
display: none;
}



#main section p.nyuukaigo {
font-weight: bold;
color: #363636;
}



#main p.bu-title {
padding: 0 0 0 10px;
font-weight: bold;
font-size: 115%;
color: #2b2bd5;
}

#main section.kurasu {
margin: 0 0 15px 0;
padding: 10px;
}
#main section.kurasu img {
margin: 15px 0 15px 30px;
}
#main section.kome {
padding: 0 0 20px 0;
}
#main section p.syoudan {
padding: 0 80px 10px 130px;
line-height: 150%;
text-indent: -6em;
}

#main section .nyuukai p {
padding: 0 10px 5px 60px;
text-indent: -2em;
}



#main section#kaikan table,
#main section#kaikan tr,
#main section#kaikan td {
border: 0px #d4d4d4 solid;
padding: 5px 10px;
}
#main section#kaikan td.youbi {
width: 100px;
}


#main section.teater img {
margin: 20px 40px 20px 20px;
}
#main section.teater h3 {
padding: 30px 0 20px 0;
border-left: 0px #7272e2 solid;
font-size: 130%;
font-weight: bold;
color: #363636;
}


#main section#kekka dl {
margin: 0 0 15px 15px;
padding: 0 0 15px 0;
border-bottom: 1px #e4e0da solid;
}
#main section#kekka dt {
float: left;
margin: 14px 20px 10px 20px;
font-size: 95%;
}
#main section#kekka dd {
padding: 13px 0 0 170px;
font-size: 120%;
}
#main section#kekka a {
color: #0000ff;
text-decoration: none;
}
#main section#kekka a:hover {
color: #aaaa00;
text-decoration: underline;
}


#main section.portrait {
float: left;
width: 35%;
margin: 0 10% 20px 5%;
padding: 10px;
border: 1px #e4e0da solid;
}
#main section.portrait img {
display: block;
width: 100%;
}
#main section.portrait p {
padding: 0 ;
text-align: center;
}
#main section.portrait p.name {
font-size: 130%;
}
#main section.portrait p.note {
font-size: 80%;
text-align: left;
}





#main section.sche img {
display: block;
margin: 0 auto 20px;
max-width: 100%;
}

#main section.sche p {
padding: 0 0 50px 30px;
line-height: 130%;
font-size: 120%;
}



#main section.sche dl {
font-size: 120%;
}
#main section.sche dl dt {
float: left;
padding: 0 20px 30px 0;
}
#main section.sche dl dd {
padding: 0 0 30px 0;
}

#main section.sche .keiko p {
font-size: 120%;
padding: 0 0 15px 8em;
text-indent: -8em;
line-height: 90%;
}
#main section.sche .keiko p span {
font-size: 90%;
}

#main section.sche .keiko dl dt {
padding: 0 20px 10px 20px;
}
#main section.sche .keiko dl dd {
padding: 0 10px 10px 20px;
}
#main section.sche .keiko dl dd.spn {
font-size: 90%;
}





#main section.sche table {
margin: 0;
width: 100%;
}
#main section.sche table tr,
#main section.sche table th,
#main section.sche table td {
border: 0px #ffffff solid;
font-size: 105%;
}
#main section.sche table th {
padding: 10px 0;
width: 130px;
background: #ffffff;
}
#main section.sche table td {
padding: 10px;
}





#main section table {
margin: 20px;
width: 85%;
}
#main section tr,
#main section th,
#main section td {
border: 1px #cfcfcf solid;
}
#main section td {
padding: 8px 15px;
line-height: 160%;
}
#main section th {
background: #e3f0fb;
padding: 15px;
text-align: left;
}
#main section table span {
color: #0000ff;
}
#main section table#hiyou span {
font-size: 80%;
}

#main section table caption {
padding: 10px 15px;
text-align: left;
font-size: 120%;
}






#main section.tel p,
#main section.fax p {
margin: 0 0 0 20px;
padding: 2px 0 10px 48px;
font-size: 180%;
letter-spacing: 0.2em;
}
#main section.tel p {
background: url(site-tel.png);
background-repeat: no-repeat;
background-position: left top;
}
#main section.fax p {
background: url(site-fax.png);
background-repeat: no-repeat;
background-position: left top;
}
#main section.tel p.kome {
padding: 2px 0 10px 20px;
font-size: 80%;
letter-spacing: 0em;
background: none;
}
#main section.tel p.tel-sp {
display: none;
}
#main section iframe {
width: 80%;
height: 800px;
}




#side section {
margin: 0 0 30px 0;
border: 1px #aad5aa solid;
border-radius: 5px;
}

#side section h2 {
padding: 10px;
text-align: center;
background: #aad5ff;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
font-size: 100%;
color: #002b55;
}

#side section p {
font-size: 90%;
line-height: 120%;
}

#side section .map {
padding: 10px 10px 3px 10px;
}

#side iframe {
width: 100%;
}




footer, 
footer .container {
background: #2b95ff;
}
footer {
padding: 50px 0 15px;
}
footer p {
text-align: right;
font-size: 85%;
color: #ffffff;
}



.facebook-wrapper {
    max-width: 500px;
    margin: 0 auto;
}
.facebook-wrapper > .fb-page {
    width: 100%;
}
.facebook-wrapper > .fb-page > span,
.facebook-wrapper iframe {
    width: 100% !important;
}





.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}






