@charset "UTF-8";
/*//////////////////////////////////////////////////////////////////////////////////////////*/
/* CUSTOM CSS (ADD YOUR CSS HERE!) */
/*//////////////////////////////////////////////////////////////////////////////////////////*/

/* PLUGIN CSS */

/*[total page]
--------------------------------------------------*/
/* body設定 */
body{
font-family:"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;/*全体の書体*/
font-size:16px;/*全体の文字サイズ*/
color:#4c4948;/*全体の文字の色*/
line-height:1.5;/*全体の行間*/
background:URL(../images/body_back.gif) repeat;
position: relative;
height: 100%;
}
@media (max-width: 575px){
body{
font-size:14px;/*全体の文字サイズ*/
}

}
/* bootstrap用body設定 */
.colWidth{
margin:0 auto;/*中央に表示*/
padding:0 20px;/*外側の空き*/
max-width:1040px!important;
position:relative;/*colWidthが外側の基準*/
}
/* リンク設定 */
a{
color:#00a0e9;/*リンクの色*/
text-decoration:none;/*リンクの装飾*/
font-weight:normal;/*リンクの文字の太さ*/
}
a:hover{
color:#;/*ホバー時のリンクの色*/
text-decoration:underline;/*ホバー時の装飾*/
font-weight:normal;/*ホバー時の文字の太さ*/
}
a.btn{
padding: 4px 8px;
letter-spacing: 0.02em;
background: #FFF;
background-size: 30px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
color: #af5490;
border: 2px solid #af5490;
}
a.btn-sm{
padding: 2px 4px;
letter-spacing: 0.02em;
background: #FFF;
background-size: 30px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
color: #af5490;
border: 1px solid #af5490;
}
/* 強調設定 */
strong{
font-weight:bold;
}
/* 文字色設定 */
.mint{color:#3aa984;font-weight:bold;}
.blue{color:#00a1e9;font-weight:bold;}
.red{color:#ee7a33;font-weight:bold;}
.paple.{color:#ee7a33;font-weight:af5490;}
/* 背景色設定 */
.bk-beige{background:#e7e0e0;}
.bk-light-beige{background:#f6e3e3;}
.bk-paple{background:#af5490;}
.bk-mustard{background:#e5d06d;}
/* コンテンツ設定 */
.content-block{
margin:50px auto;
padding:0 20%;
}
.content-wrap{
margin:50px auto;
padding:0 12%;
}
.dl-horizontal dt{
width: 90px;
color: #aa2158;
text-align: left;
}
.dl-horizontal dd{
margin-left: 100px;
}
#flow .dl-horizontal dt{
width: 150px;
color: #aa2158;
text-align: left;
}
#flow .dl-horizontal dd{
margin-left: 170px;
}
.zan.dl-horizontal dt{
width: 150px;
color: #aa2158;
text-align: left;
border-right: 1px solid;
}
.zan.dl-horizontal dd{
margin-left: 170px;
}
@media (max-width: 575px){
.dl-horizontal dt,.dl-horizontal dd,#flow .dl-horizontal dt,#flow .dl-horizontal dd,.zan.dl-horizontal dt,.zan.dl-horizontal dd{
padding-left: 0;
padding-right: 0;
margin-left: 0;
float: none;
}
}
.yagirushi-bottom{
width: 0;
height: 0;
border-style: solid;
border-width: 30px 30px 0 30px;
border-color: #ccc transparent transparent transparent;
margin-left: auto;
margin-right: auto;
margin-bottom: 20
}
.box-border1{
border-color: #ccc;
}
.program{
font-family: "copperplate",serif;
font-weight: 100;
}
/*[見出し]
--------------------------------------------------*/
/* h1設定 */
h1,h1 a{
font-size:12px;
width: 100%;
color: #746262;
text-align: right;
}
#index h1,#index h1 a{
color: #000;
text-align: right;
}
#index h1{
position: absolute;
top: 30px;
right: 30px;
z-index: 5000;
}
@media (max-width: 575px){
h1,h1 a{
font-size:10px;
text-align: center;
}
#index h1,#index h1 a{
color: #000;
text-align: center;
}
#index h1{
position: absolute;
top: 10px;
left: 0;
z-index: 5000;
}
}
/* h2設定 */
#title h2{
position: absolute;
bottom: 50%;
width: 100%;
text-align: center;
color: #FFF;
z-index:200;
font-size: 24px;
line-height: 1.8;
}
#title h2 span{
font-family: "copperplate",serif;
font-size: 50px;
border-bottom: 1px #fff solid;
font-weight: 100;
}
@media (max-width: 575px){
#title h2{
position: absolute;
bottom: 30%;
width: 100%;
text-align: center;
color: #FFF;
z-index:200;
font-size: 18px;
line-height: 1.8;
}
#title h2 span{
font-family: "copperplate",serif;
font-size: 34px;
border-bottom: 1px #fff solid;
font-weight: 100;
}
}
h3{
font-size: 36px;
font-family: "copperplate",serif;
margin-bottom: 20px;
color: #aa2158;
text-align: center;
font-weight: 100;
}
h3 span{
font-family:"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;/*全体の書体*/
font-size: 18px;
color: #746262;
}
@media (max-width: 575px){
h3{
font-size: 30px;
}
h3 span{
font-size: 16px;
}
}
h4{
font-size: 24px;
letter-spacing: 0.04;
border-bottom: solid 1px #aa2158;
line-height: 1.8;
padding-bottom: 5px;
margin-bottom: 20px;
font-weight: bold;
}
@media (max-width: 575px){
h4{
font-size: 20px;
}
}
h5{
font-size: 24px;
font-family: "copperplate",serif;
margin-bottom: 10px;
color: #aa2158;
text-align: center;
font-weight: 100;
}
h5 span{
font-family:"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;/*全体の書体*/
font-size: 16px;
color: #746262;
}
@media (max-width: 575px){
h5{
font-size: 20px;
}
h5 span{
font-size: 14px;
}

}
/*[header footer]
--------------------------------------------------*/
/* header設定 */
#header{
width: 100%;
background: URL(../images/header-back.gif) repeat-x bottom;
position: relative;
}
#index #header{
width: 100%;
background:none;
position: relative;
}
#header .colWidth{
padding:10px 20px 20px 20px;
}
#header img.img-responsive{
max-width: 50%!important;
}
/* footer設定 */
#footer{
padding-top:40px;
background:#ddd395;
width: 100%;
margin-top: 50px;
}
#footer #copyright{
background: #c0b677;
padding: 5px 0;
color: #655b1d;
}
@media (max-width: 575px){
#footer #copyright{
margin-top: 120px;
}
}
/*[slider]
--------------------------------------------------*/
.gallery{
padding-bottom: 30px;
background: URL(../images/title-back.gif) repeat-x bottom;
}
.gallery-cell {
width: 100%; /* full width */
margin: 0!important;
padding: 0!important;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.gallery-cell img{
width: 100%; /* full width */
}
.flickity-slider {
transform: none !important;
}
.gallery-cell {
left: 0 !important;
opacity: 0;
transition: opacity 1s ease-in-out;
z-index: -1;
position: relative;
background: none;
}
.gallery-cell.is-selected {
opacity: 1;
z-index: 2;
}
header .title{
top: 40%;
position: absolute;
width: 100%;
text-align: center;
}
#index-logo{
position: absolute;
width: 200px;
height: 150;
left: 50px;
top:30px;
z-index: 5000;
}
@media (max-width: 575px){
#index-logo{
position: absolute;
width: 120px;
height: 90px;
left: 50%;
top:100px;
margin-top: -45px;
margin-left: -60px;
z-index: 5000;
}
#page-logo img{
width: 120px!important;
margin-top: 10px;
margin-bottom: -10px;
}
}
/*[title]
--------------------------------------------------*/
#title{
position: relative;
height: 554px;
padding: 20px 0 34px 0;
width: 100%;
background: URL(../images/title-back.gif) repeat-x bottom;
}
#title #ami{
position: absolute;
z-index: 10;
left: 0;
top: 20px;
width: 100%;
height: 500px;
overflow: hidden;
animation: fadeIn 5s ease 0s 1 normal;
-webkit-animation: fadeIn 5s ease 0s 1 normal;
}
@keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}
#title figure#title-img{
text-align: center;
width: 100%;
height: 500px;
overflow: hidden;
}
#title figuer#title-img img{
width: 100%;
min-height:500px; 
}
@media (max-width: 575px){
#title{
width: 100%;
height: 254px;
overflow: hidden;
}
#title #ami{
width: 100%;
height: 200px;
}
#title figure#title-img{
text-align: center;
width: 100%;
height: 200px;
overflow: hidden;
}
#title figure#title-img img{
width: 120%;
min-height:200px; 
}
}
/*[main-nav]
--------------------------------------------------*/
#index ul#main-nav{
margin: 0 auto;
text-align: center;
}
#main-nav li{
text-align: center;
padding-left: 10px!important;
padding-right: 10px!important;
}
#main-nav li:nth-child(7){
padding-right: 0!important;
}
#index #main-nav li:nth-child(7){
padding-right: 10px!important;
}
#index #main-nav li:nth-child(8){
padding-right: 0!important;
}
#main-nav a{
color:#000;
font-family: "copperplate",serif;
font-size: 18px;
font-weight: 100;
}
#index #main-nav li:nth-child(1) a,#about #main-nav li:nth-child(2) a,#pick #main-nav li:nth-child(3) a,#school #main-nav li:nth-child(4) a,#studio #main-nav li:nth-child(5)  a,#catering #main-nav li:nth-child(6) a,#contact #main-nav li:nth-child(7) a{
color: #aa2158;
}
#main-nav a:hover{
text-decoration: none;
}
#main-nav a span{
font-size: 10px;
font-family:"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;/*全体の書体*/
color:#666;
}

/*[toTop]
--------------------------------------------------*/
#toTop a{
padding:30px 0 0 95px;
width:140px;
height:150px;
color:#000;
background:URL(../images/back_to_top_mono.png) no-repeat bottom left;
background-size:100%;
bottom:0;
right:10px;
position: absolute;
}
#toTop a:hover{
padding:30px 0 0 95px;
background:URL(../images/back_to_top.png) no-repeat bottom left;
width:140px;
height:150px;
background-size:100%;
}
@media (max-width: 575px){
#toTop a{
bottom:20px;
}

}

/*[map]
--------------------------------------------------*/
#map{
width: 100%;
height: 300px;
}

/*[contact]
--------------------------------------------------*/
.table{
width:100%;
max-width: 800px;
margin:10px  auto 30px auto;
background: #FFF;
}
.table td,.table th{
padding: .75rem;
line-height: 1.5;
vertical-align: top;
font-size: 14px;
}
.table-bordered{
border: 1px solid #ddd;
}
.title-contactform7{
font-weight: bold;
}
.table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
border: 1px solid #ddd;
}
.table-contactform7{
overflow: hidden;
table-layout: fixed;
}
.required-contactform7{
padding: 5px;
background: #af5490;
color: #FFF;
border-radius: 3px;
margin-right: 20px;
font-size: 12px;
font-weight: bold;
}
.table-striped>tbody>tr:nth-child(odd)>td,.table-striped>tbody>tr:nth-child(odd)>th{
background: none;
}
.unrequired-contactform7{
padding: 5px;
background: none;
color: #b7b2a6;
border-radius: 3px;
margin-right: 20px;
font-size: 12px;
font-weight: bold;

}
.table-contactform7 th{
font-weight:bold;
}
.table-contactform7 input,
.table-contactform7 textarea{
width: 98% !important;
margin: 5px 10px 10px 5px;
border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;
filter:alpha(opacity=75);-moz-opacity:0.75;opacity:0.75;
}
.table-contactform7  input[type=checkbox],.table-contactform7  input[type=radio]{
width: auto!important;
}
.address-100 input{
max-width: 100% !important;
margin: 5px 10px 10px 5px;
}
.message-100 textarea{
width: 100%;
margin: 5px 10px 10px 5px;
}
span.wpcf7-list-item{
margin-left:1em;
}
.btn-lg{
color:#FFF;
background: #af5490;
}

span.wpcf7-list-item {
display: block;
}
@media screen and (min-width: 900px){
  .table-contactform7 th{
    width:28%;
  }
    }
     
@media screen and (max-width: 900px){
.table-contactform7{
  display:block;
}     
       
  .table-contactform7 tbody,
  .table-contactform7 tr{
    display: block;
    width: 100%;
  }
  .table-contactform7 th{
  width:100%;
  display:block;
  margin: 0 auto;
  border:none;
}
.table-contactform7 td{
  display: list-item;
  list-style-type:none;
  margin:0;
  padding:0;
  width: 100%;
  border-top: none !important;
}
}
#sns{
padding-bottom: 40px!important;
background: URL(images/follow.png) no-repeat right bottom;
}
#index-about p,#index-pick p{
font-size: 20px;
line-height: 1.8;
letter-spacing: 0.01em;
}
@media (max-width: 575px){
section.box-round5.bg-white,article.box-round5.bg-white{
padding-left: 0px!important;
padding-right: 0px!important;
}
div.box-round5.bk-light-beige{
padding-left: 10px!important;
padding-right: 10px!important;
}
#index-about p,#index-pick p{
font-size: 16px;
line-height: 1.8;
letter-spacing: 0.01em;
}
}

.instagram > div{
	width:20%;
}


@media screen and (max-width: 560px){
	.instagram > div{
		width:50%;
	}

}