/* 全てに適用するCSS */

body
{ margin: 0 ; padding: 0 ; font-size: 14px ; line-height: 1.6em ;
font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS P Gothic", Osaka, sans-serif;
letter-spacing: 0px;}

h1,h2,h3,h4,h5,h6 { margin: 0; padding:0; color: #f8e0e0;}
ul, li { list-style: none;}

p { margin: 0; padding: 0; color: #79593c; }
.text-center { text-align: center;}
.text-left { text-align: left;}
.text-right { text-align: right;}
.float-left { float: left;}
.float-right { float: right;}
.tx-blue { color: #578190; }
.tx-pink { color: #cc3366;}
.tx-pink2 { color:#e4285d;}
.tx12 {font-size: 12px;}
.tx16 {font-size: 16px;}
.tx18 {font-size: 18px;}
.stg { font-weight: 600;}
.overflow { overflow: hidden;}
.clearfix { clear: both; }
.hd { display: none;}
.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px;}
.mb30 { margin-bottom: 30px;}
.mb40 { margin-bottom: 40px;}
.pd15 { padding: 0 15px;}
.visible-md { display:block;}
.visible-xs { display: none;}

a {color: #e4285d; text-decoration: none;}
a:hover {color: #e4285d; text-decoration: underline;;}

/*マウスオーバー*/
.fade{ -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
.fade:hover { opacity: 0.4; filter: alpha(opacity=60);}

/*ヘッダーー*/
header {  border-top:8px solid #f2a5a0;}
.header-wrapper { width: 908px; margin: 0 auto; padding:0 18px 0 34px; height: 166px; overflow: hidden;}
.header-name { width: 260px; padding:74px 0 0; float: left; margin-right: 68px;}
.header-logo { width: 240px; float: left; padding: 10px 0 0;}
.header-tools { width: 296px; float: right; padding: 28px 0 30px;}
.sns-icons {margin-bottom: 10px; padding: 0;}
.shop-icons { padding: 0 64px 0 85px;}


/*グロナビー*/
nav { background: #fdf8f8; height: 105px; border-bottom: 1px solid #f8e0e0;}
nav ul {
  list-style: none;
  width: 960px;
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
}
nav ul li {
  float: left;
}
@media only screen and (max-width: 959px) {
  nav {
    background:#fdf8f8;
    margin-bottom: 40px;
  }
  nav ul {
    width: 100%;
    border-top: solid 1px #fedede;
  }
  nav li {
    float: none;
    width: 50%;
    overflow: hidden;
    text-align: center;
  }
  nav ul li img {
    display: none;
  }
  nav li a {
    display: block;
    background: #fdf8f8;
    border-bottom: solid 1px #fedede;
    border-right: solid 1px #fedede;
    padding: 14px 6px;
    text-decoration: none;
    color: #99772e;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  nav li a:hover {
    background: #f2a5a0;
    color: #fff;
  }
  nav li:nth-child(odd) a {
    border-right: solid 1px #bbb;
  }
  nav li a:before {
    content: attr(data-label);
  }
}


/*ページトップのスクロールボタン*/
#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 30px;
}
#page-top a {
	text-decoration: none;
	color: #f7cfcf;
	padding: 10px;
	text-align: center;
	display: block;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
  border: 1px solid #fb5050;
  background: #fb5050;
  opacity: 0.5;
}
#page-top a:hover {
	text-decoration: none;
	background: #fff;
	color:#fb5050;
}


/*フッター*/
.footer-sns { display: none;}
footer { text-align: center; background: #999; padding:24px 15px; background: url(../img/bg_footer.jpg) no-repeat;
background-size: cover; min-height: 38px;}
footer p {color:#fefefe; }

/*コンテンツ用のラッパー*/
.wrapper { width:960px; margin:0 auto; padding: 34px 0 50px; }
.container { width:932px; margin:0 auto; background: #fff; padding: 13px 13px 10px;}
.container h2 { margin-bottom: 30px;}
.second-cap { line-height: 1.8em; font-size: 18px; text-align: center; color: #578190; }

.btn-pink { margin: 20px 0; background-color: #ffcad2;
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
      transition: all  0.3s ease;
  border: 1px solid #f6b5b8; padding:10px 20px; text-align: center; border-radius: 6px; }
.btn-pink:hover { background: #fda7b4; }
.btn-pink a { color:#e4285d; text-decoration: none;}
.btn-pink a:hover { text-decoration: underline;;}

.btn-white { width: 30%; margin: 20px auto; background-color: #fff;
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
      transition: all  0.3s ease;
  border: 1px solid #e2e2c7; padding:10px 20px; text-align: center; border-radius: 6px; }
.btn-white:hover { background: #f2f2dd; }
.btn-white a { color:#f46a91; text-decoration: none;}
.btn-white a:hover { text-decoration: underline;;}


/*INDEX.html*/
#bg_index { background: url(../img/bg_index.jpg)no-repeat; background-size: cover; background-position: top left; }
.slide-box { background: #fdf8f8; padding:15px 13px 30px; border: 1px solid #f6e0e0; text-align: center; margin: 0 0 30px;}
.index-box { background: #fff; padding:30px; border: 1px solid #f6e0e0; overflow: hidden; }
.fb { float: left; width:300px; }
.news { float: right; width:554px; background: url(../img/bg_news.gif) repeat; min-height: 474px; border: 1px solid #ede3d1; padding:12px 12px; }
.news p { border-top: 1px dashed #b79c72; padding:12px 0px; color: #578190;  }
.news-pd {padding:0 16px; margin: 15px 0 0;}
#bg_sub { background: url(../img/bg_prof.png) repeat-x top; border-top:1px solid #fff;  }
.wrapper-sub { width:960px; margin:0 auto; padding: 0px 0 50px; }
.prof { float: left; width:326px; }
.prof h3{ margin-bottom: 20px;}
.history { float: right; width:550px; color:#816042; }
.history h3{ margin-bottom: 20px;}
.history table { padding: 0; margin: 0 0 20px; width: 100%;}
.history td{ padding: 0 10px 0 0; margin: 0; vertical-align: top;}
.year { width:12%; }
.date { width:9%; text-align: right;}
.event { width: 79%; }


/*GALLERY.html*/
#bg_gallery { background: url(../img/bg_gallery.jpg)no-repeat; background-size: cover; background-position: top left; }
.gallery { border: 1px solid #cff7f0; overflow: hidden; }
.gal-box { width: 289px; float: left; border: 1px solid #ffdadf; background: #fff2f1; padding: 7px; margin: 0px 8px 10px 0; height: 224px;}
.gal-box2 { width: 289px; float: left; border: 1px solid #ffdadf; background: #fff2f1; padding: 7px; margin: 0px 0px 10px 1px; height: 224px;}
.gallery-btn { padding: 20px 230px 30px;}


/*WEDDING.html*/
#bg_wedding { background: url(../img/bg_wedding.jpg)no-repeat; background-size: cover; background-position: top left; }
.wedding { border: 1px solid #dcf2fc; }
.box-wedding { background: url(../img/bg_paper.gif)repeat; width:904px; padding: 13px 13px 8px; margin: 40px 0px;
  overflow: hidden; border: 1px solid #ffebf0;}
.wedding01 { float: left; width: 524px; margin:26px 0 0 20px; }
.wedding-inner  { padding: 10px 20px 0; }
.wedding02 { float: right; }


/*ORDER.html*/
#bg_order { background: url(../img/bg_order.jpg)no-repeat; background-size: cover; background-position: top left; }
.order { border: 1px solid #f9e4b1; }


/*LESSON.html*/
#bg_lesson { background: url(../img/bg_lesson.jpg)no-repeat; background-size: cover; background-position: top left; }
.lesson { border: 1px solid #e6e4fa; }
.box-lesson { background: url(../img/bg_paper.gif)repeat; width:872px; padding: 13px 30px 8px; margin: 40px 0px;
  overflow: hidden; border: 1px solid #ffebf0;}
.lesson01 { padding: 4px; background: #fff; float: left; border: 1px solid #f6e8f9; margin-right: 20px; ;}
.lesson02 { padding: 4px; background: #fff; border: 1px solid #f6e8f9; float: right;}
.lesson-btn { padding: 0px 200px; }
.tx-purple { color: #6633cc;}
.lessson-info { border: 1px solid #ddd7f0; background: #f2effb; padding: 18px;  margin: 20px 0 30px; }
.lesson-info-txt { color: #957fd9;}


/*ABOUT.html*/
#bg_about { background: url(../img/bg_about.jpg)no-repeat; background-size: cover; background-position: top left; }
.about { border: 1px solid #eaf0d0; }
.box-about{ background: url(../img/bg_paper.gif)repeat; width:872px; padding: 16px 30px 30px; margin: 0px 0px 14px;
  overflow: hidden; border: 1px solid #ffebf0;}
.about-txt { float: left; }
.about-txt p { line-height: 2em;}
.about-txt p span { color: #cc0000; font-weight: 600;}
.about-pic { padding: 4px; background: #fff; border: 1px solid #f6e8f9; float: right; margin-bottom: 4px; }
.about-attn { color: #cc0000; font-weight: 600; text-align: center; margin: 40px 0 ; line-height: 2em;}


/*CONTACT.html*/
#bg_contact { background: url(../img/bg_contact.jpg)no-repeat; background-size: cover; background-position: top left; }
.contact { border: 1px solid #feecee; }
.box-contact { background: url(../img/bg_paper.gif)repeat; width:872px; padding: 32px 30px 60px; margin: 30px 0px;
  overflow: hidden; border: 1px solid #ffebf0;}
.form-wrap { background: #fff; margin: 30px 30px; overflow: hidden; padding: 30px;}
.form-txt1 { margin: 0 30px 20px; border-bottom: 1px dashed #c5b08e; padding-bottom: 20px; }
.form-txt1 h4, .form-txt2 h4, .form-txt3 h4 { color: #cc3366; font-weight: 600; margin-bottom: 10px;}
.form-txt2 { width: 44%; float: left; margin-left: 30px;}
.form-txt3 { width: 44%; float: right; margin-right: 30px;}

/* FORM */
.test-form-box{ width:90%;margin:auto;text-align:left;}
/*プレースホルダーの色*/
input:::-webkit-input-placeholder { color: #fc9898; }
input::-moz-placeholder { color: #fc9898; }
textarea:::-webkit-input-placeholder { color: #fc9898; }
textarea::-moz-placeholder { color: #fc9898; }

/*入力時の背景色*/
input:focus, select:focus, textarea:focus {
background: #fff3f6;
}

/*入力フォームの設定*/
.form-text{
width:100%;
font-size:14px;
border:1px solid #fed6e0;
border-radius: 4px;
color: #79593c;
background:#fff;
margin-bottom:20px;
padding:10px;
}

.form-text2{
width:60%;
font-size:14px;
border:1px solid #fed6e0;
border-radius: 4px;
color: #79593c;
background:#fff;
margin-bottom:20px;
padding:10px;
text-align: left;
}

.form-text3{
width:20%;
font-size:14px;
border:1px solid #fed6e0;
border-radius: 4px;
color: #79593c;
background:#fff;
margin:0 10px 20px 0;
padding:10px;
text-align: left;
}

/*submitボタンの設定*/
.form-submit{
margin:10px auto;
padding:10px 20px;
font-size:14px;
border:1px solid #f6b5b8;
border-radius: 6px;
-webkit-border-radius: 6px;    /* Safari,Google Chrome用 */
-moz-border-radius: 6px;
color:#fff;
background: #ffcad2; /* for non-css3 browsers */
box-shadow: 3px 3px 3px rgba(0,0,0,0.25);
-moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.25);
-webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.25);}

.form-submit:hover{
background: #fb9797; /* for non-css3 browsers */
}

.formTable { margin:20px 0 20px; width:100%;  }
.formTable th { width:30%; border-bottom:1px solid #fed6e0; background:#fff6f6; padding:10px; color:#fc9898; font-weight: 500;}
.formTable td { width:70%; border-bottom:1px solid #fed6e0; padding:10px; color: #79593c;}
