@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600italic,800);
body, h1, h2, h3, h4, h5, h6 {
color:#4F636B;
font-weight:400
}
a, body {
color:#4F636B;
}
a, a:hover {
text-decoration:none;
}

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
margin:0;
padding:0;
border:0;
font-size:100%;
vertical-align:baseline
}
body, h2, h3, h4, h5, h6 {
font-size:1em
}
article, aside, details, figcaption, figure, figure img, footer, header, hgroup, menu, nav, section {
display:block
}
ol, ul {
list-style:none
}
blockquote, q {
quotes:none
}
blockquote:after, blockquote:before, q:after, q:before {
content:'';
content:none
}
table {
border-collapse:collapse;
border-spacing:0
}
body {
line-height:1.2em;
background:#FFF;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
h1 {
font-size:2em
}
a {
outline:0;
-webkit-transition:all .3s ease;
-moz-transition:all .3s ease;
-o-transition:all .3s ease;
transition:all .3s ease
}
a:hover {
color:#000
}
strong {
font-weight:700
}


embed, img, object, video {
width:100%;
height:auto
}


header {
position:fixed;
z-index:1000;
height:auto;
width:100%;
top:0;
left:0;
background-color:#113A58;
color:#eeebe4;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
-webkit-transform:translateZ(0);
-moz-transform:translateZ(0);
-ms-transform:translateZ(0);
-o-transform:translateZ(0);
transform:translateZ(0);
-webkit-backface-visibility:hidden;
backface-visibility:hidden;
-webkit-transition:-webkit-transform .3s;
-moz-transition:-moz-transform .3s;
transition:transform .3s
}
.navbar-toggle, .logo span {
color:transparent!important
}
header.nav-is-visible {
-webkit-transform:translateX(-260px);
-moz-transform:translateX(-260px);
-ms-transform:translateX(-260px);
-o-transform:translateX(-260px);
transform:translateX(-260px)
}
header::before {
display:none;
content:'mobile'
}
.logo {
display:inline-block;
width:150px;
height:auto;
margin-top:8px;
margin-bottom:5px;
margin-left:15px;
-o-transform:translateZ(0);
transform:translateZ(0);
-webkit-backface-visibility:hidden;
backface-visibility:hidden;
}
.navbar-toggle span::after, .navbar-toggle span::before, .logo {
-webkit-transform:translateZ(0);
-moz-transform:translateZ(0);
-ms-transform:translateZ(0)
}
.navbar-toggle {
display:block;
position:absolute;
right:0;
top:0;
height:100%;
width:50px;
overflow:hidden;
white-space:nowrap;
}
.navbar-toggle span {
position:absolute;
height:2px;
width:20px;
top:50%;
margin-top:-1px;
left:50%;
margin-left:-10px;
-webkit-transition:background-color .3s .3s;
-moz-transition:background-color .3s .3s;
transition:background-color .3s .3s;
background-color:#eeebe4;
}
.navbar-toggle span::after, .navbar-toggle span::before {
content:'';
position:absolute;
width:100%;
height:100%;
background-color:#eeebe4;
transform:translateZ(0);
-webkit-backface-visibility:hidden;
backface-visibility:hidden;
-webkit-transition:-webkit-transform .3s .3s;
-moz-transition:-moz-transform .3s .3s;
transition:transform .3s .3s
}
.navbar-toggle span::before {
-webkit-transform:translateY(-6px);
-moz-transform:translateY(-6px);
-ms-transform:translateY(-6px);
-o-transform:translateY(-6px);
transform:translateY(-6px)
}
.navbar-toggle span::after {
-webkit-transform:translateY(6px);
-moz-transform:translateY(6px);
-ms-transform:translateY(6px);
-o-transform:translateY(6px);
transform:translateY(6px)
}
.nav-is-visible .navbar-toggle span {
background-color:rgba(238, 235, 228, 0)
}
.nav-is-visible .navbar-toggle span::before {
-webkit-transform:translateY(0) rotate(-45deg);
-moz-transform:translateY(0) rotate(-45deg);
-ms-transform:translateY(0) rotate(-45deg);
-o-transform:translateY(0) rotate(-45deg);
transform:translateY(0) rotate(-45deg)
}
.nav-is-visible .navbar-toggle span::after {
-webkit-transform:translateY(0) rotate(45deg);
-moz-transform:translateY(0) rotate(45deg);
-ms-transform:translateY(0) rotate(45deg);
-o-transform:translateY(0) rotate(45deg);
transform:translateY(0) rotate(45deg)
}
.mainnav {
position:fixed;
z-index:999;
top:0;
right:0;
width:260px;
height:100vh;
overflow:auto;
/*
-webkit-overflow-scrolling:touch;
*/
visibility:hidden;
background:#113A58;
-webkit-transition:visibility 0s .3s;
-moz-transition:visibility 0s .3s;
transition:visibility 0s .3s;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
color:#FFF;
}


.mainnav a {
display:block;
padding:.4em 2em .4em 3em;
/*border-bottom:1px solid #333;*/
color:#FFF;
font-size: 0.75em;
-webkit-transition:-webkit-transform .3s, opacity .3s;
-moz-transition:-moz-transform .3s, opacity .3s;
transition:transform .3s, opacity .3s;
font-weight:800 !important;
}
.mainnav a:hover {
color:#CAAC52;
}
.mainnav li.instagram {
margin-top:10px;
}
.mainnav li.facebook {
margin-bottom:15px;
}
.mainnav li.banner a:hover {
opacity:0.85;
}
.mainnav li:last-child {
margin-bottom:140px;
}

li.rightside_logo {
width:156px;
margin-top:40px;
margin-bottom:20px;
margin-left:20px;
}
li.rightside_logo a {
display:block;
width:156px;
}
li.rightside_logo img {
width:100%;
}

.mainnav li i {
margin-right: 8px;
}
.mainnav li ul {
position:absolute;
top:0;
left:0;
width:100%;
-webkit-transition:-webkit-transform .3s;
-moz-transition:-moz-transform .3s;
transition:transform .3s;
-webkit-transform:translateX(260px);
-moz-transform:translateX(260px);
-ms-transform:translateX(260px);
-o-transform:translateX(260px);
transform:translateX(260px)
}
.mainnav.nav-is-visible {
visibility:visible;
-webkit-transition:visibility 0s 0s;
-moz-transition:visibility 0s 0s;
transition:visibility 0s 0s
}

.mainnav .cd-subnav-trigger {
position:relative
}
.mainnav .cd-subnav-trigger::after, .mainnav .cd-subnav-trigger::before {
content:'';
position:absolute;
top:50%;
margin-top:-1px;
display:inline-block;
height:2px;
width:10px;
background:#eeebe4;
-webkit-backface-visibility:hidden;
backface-visibility:hidden;
}
.mainnav .placeholder, .no-js .navbar-toggle, .no-js .cd-subnav-trigger {
display:none
}
.mainnav .cd-subnav-trigger::before, .mainnav .go-back a::before {
-webkit-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-ms-transform:rotate(45deg);
-o-transform:rotate(45deg);
transform:rotate(45deg)
}
.mainnav .cd-subnav-trigger::after, .mainnav .go-back a::after {
-webkit-transform:rotate(-45deg);
-moz-transform:rotate(-45deg);
-ms-transform:rotate(-45deg);
-o-transform:rotate(-45deg);
transform:rotate(-45deg)
}
.mainnav .cd-subnav-trigger::after, .mainnav .cd-subnav-trigger::before {
right:20px;
-webkit-transform-origin:9px 50%;
-moz-transform-origin:9px 50%;
-ms-transform-origin:9px 50%;
-o-transform-origin:9px 50%;
transform-origin:9px 50%
}
.mainnav.nav-is-visible {
visibility:visible;
-webkit-transition:visibility 0s 0s;
-moz-transition:visibility 0s 0s;
transition:visibility 0s 0s
}

.mainContents::before {
display:none;
content:'mobile'
}
.mainContents {
position:relative;
z-index:2;
/*min-height:100vh;
padding-top:10px;*/
background-color:#eeebe4;
-webkit-transition:-webkit-transform .3s;
-moz-transition:-moz-transform .3s;
transition:transform .3s
}
.mainContents.nav-is-visible {
-webkit-transform:translateX(-260px);
-moz-transform:translateX(-260px);
-ms-transform:translateX(-260px);
-o-transform:translateX(-260px);
transform:translateX(-260px)
}

.content {
margin:0 auto;
/*max-width:1600px*/
}


.sp_toplead {
display:block;
background:url(../img/top_lead_bg.svg) no-repeat center center #113A57;
padding:40px 70px;
margin-top:-5px;
}

.container:after {
display:table;
clear:both
}


.clearfix {
clear:both
}
.sp_only {display:block;}
.pc_only {display:none;}	



#footer {
position:relative;
overflow: hidden;
background-color:#E2E1D7;
background-size:cover;
background-position:center center;
}
#footer .copyright {
width:100%;
display:block;
text-align:center;
color:#4F636B;
margin:10px 0;
padding:0;
font-size:11px;
}

.osusume {border:solid 1px #4F636B; padding-bottom:4px;margin-bottom:5px;display:block;text-align:center;padding:2px 0 0;}

.box {width:92%;margin:0 auto 50px;}
#pagetitle {background:url(../img/sectionbar_bg.svg) no-repeat bottom right #FFF;margin-top:50px;padding:20px;border-top:none;background-size:220px auto;}
#pagetitle h1 {color:#113A58;font-size:18px;width:100%;text-align:left;margin:0 auto;}
#page_contents {padding:20px;}
#page_contents .box h2 {font-size:18px;padding:20px 0;}

.photobox {overflow:hidden:margin:0 0 50px;display:block;}
.photobox img {border:solid 5px #FFF;width:96.5%;margin:20px 0 10px;}
.photobox p {font-size:13px;margin:0 0 10px;}
.box1of2,.box1of3 {overflow:hidden:}
.box1of2 li:last-child, .box1of3 li:last-child {margin-right:0;}
.box1of2 li {width:46.1%;float:left;margin-right:20px;}
.box1of3 li {width:100%;float:left;margin-right:0;overflow:hidden;}
.box1of3 li img {float:left;width:46%;margin-right:10px;}
.box1of3 li p {padding:25px 0 0;}

/**
* pagetop
* ----------------------------------------------------------------------------
*/

#pagetop {
display: none;
position: fixed;
bottom: 60px;
right: 60px;
cursor: pointer;
color: #fff;
font-size:12px;
z-index: 2;
}

#pagetop a {
display:block;
width: 14px;
height: 16px;
padding: 8px 10px 12px 12px;
cursor: pointer;
color:#FFF;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
background:rgba(17,58,88,0.8);
}


#pagetop a:hover {
background:rgba(17,58,88,0.6);
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}

#contactbar {
display:none;
}



@media (max-width:480px) {
#pagetop {
display: none;
position: fixed;
bottom: 100px;
right: 20px;
cursor: pointer;
color: #fff;
font-size:12px;
}
#pagetop a {
width: 18px;
height: 20px;
padding: 8px 10px 12px 15px;
}

#contactbar {
text-align:center;
position: fixed;
width:100%;
background:rgba(17,58,88,0.6);
padding:5px 0;
bottom:0;
display:block;
z-index: 1000;
}
#contactbar img {
width:90%;
margin:0 auto;
}

}

@media (max-width:320px) {
#pagetop {
display: none;
position: fixed;
bottom: 60px;
right: 15px;
cursor: pointer;
color: #fff;
font-size:12px;
}
}







/*=========================================================================================================================================================================

Responsive

=========================================================================================================================================================================*/




@media only screen and (min-width:1024px) {
.sp_only {display:none;}
.pc_only {display:block;}


.mainContents::before, header::before {
content:'desktop'
}

header {
height:100%;
width: 260px;
}

header.nav-is-visible {
-webkit-transform:translateX(0);
-moz-transform:translateX(0);
-ms-transform:translateX(0);
-o-transform:translateX(0);
transform:translateX(0)
}
.top {
margin-top:-30px;
}

.logo {
position:absolute;
z-index:1000;
width:156px;
margin-top:45px;
margin-left:52px;
}
.logo a {
display:block;
width:156px;
}
.logo img {
width:100%;
}
.navbar-toggle {
display:none;
}

.mainnav {
position:fixed;
top:0;
left:0;
visibility:visible;
text-align:left;
font-weight:bold;
padding:180px 0 0;
color:#FFF;
}

.mainnav li.rightside_logo a {
display:none;
}

.content {
margin:0 0 0 260px;
max-width:1600px;

}
.mainContents {
padding-top: 0;
}
.mainContents.nav-is-visible {
-webkit-transform:translateX(0);
-moz-transform:translateX(0);
-ms-transform:translateX(0);
-o-transform:translateX(0);
transform:translateX(0)
}

.top  {
position:relative;
}
.top img {
display:block;
width:100%;
height:auto;
min-width:240px;
}

                                                  
}


@media print, screen and (min-width:641px) {
/* __________________________________________________.content */
[data-screen-sp] {
display:none!important;
}
.content .top {
position:relative;
}
.content .top .mainvisual {
display:block;
width:100%;
height:auto;
min-width:240px;
}
.content .top > p,
.content .top > h1 {
position:absolute;
}
.content .top > p {
top:120px;
left:49.26%;
}
.content .top > h1 {
top:0;
left:0;
}
.content .top > h1 img {
width:100%;
height:auto;
}

.box {
width:800px;
margin: 0 auto;
padding: 65px 0;
}

.content article {
overflow: hidden;
}
.content article > div {
overflow: hidden;
}

.content article section {
height:530px;
font-size:12px;
}

.moreView {
font-size:12px;
}
.moreView a {
color:#FFF;
padding:4px 12px;
background: #113A58;
transition: all 0.3s ease-out 0s;
}
.moreView a:hover {
background: #006890;	
}
.moreView i {
margin:0 2px 0 0;
}


.moremore {
font-size:12px;
text-align: center;
display:block;
}
.moremore a {
color:#FFF;
padding:4px 12px;
background: #113A58;
transition: all 0.3s ease-out 0s;
}
.moremore a:hover {
background: #006890;	
}
.moremore i {
margin:0 2px 0 0;
}



.morelook {
text-align: center;
font-weight: 700;
margin:15px auto;
display:block;
color:#006890;
width: 200px;
}
.morelook i {
margin:0 5px 0 0;
}
.morelook a {
display: block;
padding:4px 0;
color:#000;
border:solid 2px #000;
border-radius:5px;
}
.morelook a:hover {
color: #7F1083;
border:solid 2px #7F1083;
}









.content .cont_section .section_box section {
padding-left:3.92%;	
}





#about section {
margin:0;
float:left;
width:33.322%;
background-color:#EEEDE3;
}
#about section h1 {
padding:45px 45px 25px 45px;
margin: 0;
width:80%;
}
#about section p {
padding:0 45px 45px;
}

#about .photo {
width:66.666%;
height:530px;
overflow: hidden;
float:right;
position:relative;
}
#about .photo > img {
width:100%;
min-width:640px;
height:auto;
float:left;
}
#about a {
margin-right:35px;
}
#about .mvInqArea {
width:100%;
height: 100%;
text-align: center;
background-color:#fff;
display:block;
margin-top:30px;
}
#about .mvInqArea p {
margin:0 0 12px;
padding:40px 25px 0;
font-size:18px;
}
#about .mvInqArea span {
margin:10px;
padding:0;
font-size:12px;
display: block;
}
#about .mvInqArea .moreView {
width:100%;
margin:0 20px !important;
}


#menu section {
float:left;
width:100%;
height:3650px;
padding-left:3.92%;	
background:#E2E1D7;
}
#menu section h1 {
font-size:0;
margin:50px 45px 15px 0;
width:18%;
}
#menu section p {
margin:30px 40px 20px 0;
font-size:12px;
}
#menu section p img {
display:block;
margin-bottom:19px;
}
#menu a {
margin-right:35px;
}
#menu section ul {
overflow:hidden;
font-size: 12px;
margin-right:0;
}
#menu section ul li{
float:left;
width:44.8%;
display: inline-block;
padding-right: 24px;
}
#menu section ul li span,
#menu section p span {
padding-bottom:3px;
border-bottom:dotted 1px #666;
margin:0 0 3px;
display:block;
}





#menu1 section {
float:right;
width:33.232%;
background-color:#F6F0E3;
}

#menu1 section h1 {
padding:85px 45px 25px 45px;
width:72%;
}
#menu1 section p {
padding:0 45px 45px;
font-size:12px;
line-height:1.6em;
}
#menu1 .photo div {
position:relative;
height:530px;
overflow: hidden;
}
#menu1 .photo img {
display:block;
width:100%;
min-width:320px;
height:auto;
}

#menu1 .photo {
width:66.667%;
overflow: hidden;
float:left;
}
#menu1 .photo > div {
width:50%;
float:left;
}



#menu2 section {
margin:0;
float:left;
width:33.232%;
background-color:#EEEDE3;
}
#menu2 section h1 {
padding:85px 45px 25px 45px;
margin: 0;
width:72%;
}
#menu2 section p {
padding:0 45px 45px;
}
#menu2 .photo {
width:66.666%;
height:530px;
overflow: hidden;
float:right;
position:relative;
}
#menu2 .photo > img {
width:100%;
min-width:640px;
height:auto;
float:left;
}
#menu2 a {
margin-right:35px;
}




#menu3 section {
float:right;
width:33.232%;
background-color:#F6F0E3;
}

#menu3 h1 {
padding:85px 45px 25px 45px;
width:65%;
}
#menu3 p {
padding:0 45px 45px;
font-size:12px;
line-height:1.6em;
}
#menu3 .photo div {
position:relative;
height:530px;
overflow: hidden;
}
#menu3 .photo img {
display:block;
width:100%;
min-width:320px;
height:auto;
}

#menu3 .photo {
width:66.667%;
overflow: hidden;
float:left;
}
#menu3 .photo > div {
width:50%;
float:left;
}


#message section {
margin:0;
float:left;
width:70%;
background-color:#EEEDE3;
}
#message section h1 {
padding:85px 45px 25px 45px;
margin: 0;
width:22%;
}
#message section p {
padding:0 45px 45px;
}
#message .photo {
float:left;
width:20%;
padding: 85px 0;
}
#message .photo img {
width:100%;
}









.contentsArea {
overflow:hidden;
}
.contentsArea article {
overflow: hidden;
font-size: 12px;
padding-top:60px;
padding-bottom:60px;
}
.contentsArea article i {margin-right:10px;}

.sectionbar {
width:100%;
height:290px;
position: relative;
background:#E2E1D7;
/*background-size:cover;
background: url(../img/sectionbar_bg.svg) top right no-repeat #E2E1D7;*/
}



.instagramBox {
padding-left:3.92%;
text-align: center;
}
.instagramBox h1 {width:200px;margin:0 auto;}


#news section {
float:left;
width:62.766%;
height:330px;
padding-left:3.92%;	
background:#FFF;
}
#news section h1 {
font-size:0;
margin:50px 45px 15px 0;
width:18%;
}
#news section p {
margin:30px 68px 30px 0;
font-size:12px;
}
#news .photo {
width:33.295%;
height:330px;
overflow: hidden;
float:right;
position:relative;
}
#news .photo > img {
width:100%;
min-width:340px;
height:auto;
float:left;

}
#news section ul {
overflow:hidden;
font-size: 12px;
margin-right:35px;
}
#news section ul li{
margin-bottom:8px;
padding-bottom:5px;
border-bottom:dotted 1px #CCC;
}



#access {
background-color:#EEEDE3;
}
#access .photo {
float:left;
padding-left:3.92%;
margin-right:40px;
margin-bottom:40px;
}
#access .photo img {
margin-top:5px;
display:block;
}
#access .photo img:first-child {
}

#access dl {
margin-bottom:20px;
margin-top:5px;
}
#access dl dt {
margin-bottom:6px;
}
#access dl dt img {
width:20%;
}
#access dl dd {
margin-right:10px;
font-size: 13px;
}
#access section ul {
margin-bottom:25px;
min-height:88px;
}
#access section ul li {
margin-right:2px;
display:inline-block;
padding:10px 1.84%;
width:27.574%;
max-width:190px;
min-height:44px;
color:#95772f;
border:1px solid #95772f;
vertical-align: top;
}
#access section ul li:first-child {
width:25.574%;
}
#access section ul li:last-child {
width:29.574%;
}


#pagetitle {background:url(../img/sectionbar_bg.svg) no-repeat bottom right #FFF;margin-top:0px;padding:60px;border-top:none;}
#pagetitle h1 {color:#113A58;font-size:28px;width:980px;text-align:left;margin:0 auto;}
#page_contents {padding:20px;font-size:13px;}
#page_contents .box h2 {font-size:18px;border-left:solid 5px #113A58;padding:3px 0 3px 10px;margin:0 0 30px;}
#page_contents .box h3 {font-size:16px;padding:0;margin:0 0 30px;}

.photobox {overflow:hidden:margin:0 0 50px;display:block;}
.photobox img {border:solid 8px #FFF;width:98%;margin:20px 0 10px;}
.photobox p {font-size:13px;margin:0 0 10px;}
.box1of2,.box1of3 {overflow:hidden:}
.box1of2 li:last-child, .box1of3 li:last-child {margin-right:0;}
.box1of2 li {width:48%;float:left;margin-right:20px;}
.box1of3 li {width:31.10%;float:left;margin-right:20px;}
.box1of3 li img {width:92%;}


.instagram_photolist {max-width: 810px;overflow: hidden;margin: 30px auto;padding:0;position: relative;z-index:30;width:100%;}
.instagram_photolist li{display:block;margin:8px 12px 0;width:21.85%;float:left;}
.instagram_photolist li a {display: block;margin: 0 auto;text-align:center;padding:0;}
.instagram_photolist li a img {width: 100%;height: auto;padding:6px;border:solid 1px #CCC;}
.instagram_photolist li span {display: block;text-align: center;padding: 10px 0 0 0;}






}



/* 印刷CSS pc */
@media print {
}

/*tablet*/
@media screen and (max-width:960px) and (min-width:641px) {
#about section p {
padding:0 45px 25px;
}
#menu section {
height:480px;
}
#menu .photo {
height:480px;
}
#menu .photo > img {
min-width:700px;
}



#access section ul li {
margin:0 10px 6px 0;
display:block;
padding:10px 1.84%;
width:auto;
max-width:100%;
min-height:0;
vertical-align: top;
}
#access section ul li br {
display:none;
}
#access section ul li:first-child {
width:auto;
}
#access section ul li:last-child {
width:auto;
}
}





/*smart*/
@media screen and (max-width:640px) {
/* __________________________________________________.content */

[data-screen-pc] {
display:none!important;
}

.moreView {
font-size:12px;
}
.moreView a {
color:#FFF;
padding:4px 15px;
background: #113A58;
transition: all 0.3s ease-out 0s;
}
.moreView a:hover {
background: #006890;	
}
.moreView i {
margin:0 2px 0 0;
}

#access .moreView {
margin-left:25px;
}

.content .top {
position:relative;
padding-top:50px;
background-color:#fff;
}
.content .top .mainvisual {
display:block;
width:100%;
/*min-width:480px;*/
height:auto;
}

.content .top > p {
padding:9.616% 0 8.015%;
text-align: center;
}
.content .top > p img {
margin:0 auto;
width:54.5%;
}
.content .top > h1 {
/*padding-bottom:8.015%;*/
}
.content .top > h1 img {
margin:0 auto;
width:64.1%;
}
.content article {
overflow: hidden;
}
.content article > div {
overflow: hidden;
}
.content article p {
letter-spacing: 0.03em;
font-size: 13px;
}
.content article section {
padding:0 0 6.4% 7%;
float:none;
width:100%;
background-color:#f1eeea;
box-sizing:border-box;
}
.content article section h1 {
padding-top:12.4%;
font-size:0;
}


#menu1 > div > .photo,
#menu3 > div > .photo {
width:100%;
overflow: hidden;
}
#menu1 > div > .photo div,
#menu3 > div > .photo div {
position:relative;
width:50%;
height:344px;
overflow: hidden;
float:left;
transition:0.7s;
}
#menu1 > div > .photo img,
#menu3 > div > .photo img {
display:block;
width:100%;
min-width:200px;
height:auto;
position:absolute;
left:50%;
margin-left:-100px;
transition:0.7s;
}
#about .photo,
#menu2 .photo {
width:100%;
height:344px;
overflow: hidden;
position:relative;
transition:0.6s;
}
#about .photo img,
#menu2 .photo img{
transition:0.6s;
width:auto;
position:absolute;
height:344px;
right:0;
}


#about section {
padding:0 !important;
margin:0 !important;
}
#about section h1 {
padding-left:28px;
padding-right:28px;
margin-bottom: 20px;
width:66%;
}
#about section p {
padding-left:28px;
padding-right:28px;
}



.mvInqArea {
width:100%;
text-align: center;
background-color:#fff;
display:block;
margin:45px auto 0;
padding:30px 0 40px;
}
.mvInqArea p {
margin:0 0 15px;
padding:0;
font-size:18px !important;
}
.mvInqArea span {
margin:10px 0 0;
padding:0;
font-size:12px !important;
line-height: 1.2em;
display: block;
}



#menu {
width:100%;
height:auto;
position: relative;
background:#E2E1D7;
}
#menu section {
float:none;
width:100%;
}
#menu section h1 {
font-size:0;
margin:0 45px 20px 0;
width:28%;
}
#menu section p {
margin:0 48px 30px 0;
}
#menu section p img {
display:block;
margin-bottom:19px;
}
#menu .photo {
display:none;
}

#menu a {
margin-right:35px;
}
#menu section ul {
overflow:hidden;
font-size: 13px;
margin-right:30px;
}
#menu section ul li{
float:left;
width:100%;
margin-right:15px;
margin-bottom:25px;
}
#menu section ul li span,
#menu section p span {
padding-bottom:3px;
border-bottom:dotted 1px #666;
margin:0 0 3px;
display:block;
}


#menu1 {
width:100%;
height:auto;
position: relative;
}
#menu1 section {
float:none;
width:100%;
}
#menu1 section h1 {
margin:0 0 20px 0 !important;
width:62%;
}
#menu1 section p {
padding:0 45px 25px 0;
}



#menu2 section {
margin:0;
float:none;
width:100%;
background-color:#EEEDE3;
}
#menu2 section h1 {
padding:35px 45px 20px 0;
margin: 0;
width:62%;
}
#menu2 section p {
padding:0 45px 25px 0;
}


#menu3 {
width:100%;
height:auto;
position: relative;
}
#menu3 section {
float:none;
width:100%;
}
#menu3 section h1 {
margin:0 0 20px 0 !important;
width:62%;
}
#menu3 section p {
padding:0 45px 25px 0;
}



#message section {
margin:0;
float:none;
width:100%;
background-color:#EEEDE3;
}
#message section h1 {
margin:30px 0 20px 0 !important;
width:62%;
padding: 0;
}
#message section p {
padding:0 25px 0 0;
}
#message .photo {
float:none;
width:60%;
padding:0;
margin: 0 auto 30px;
}
#message .photo img {
width:100%;
}



.contentsArea {
overflow:hidden;
}
.contentsArea article {
overflow: hidden;
padding-top:40px;
padding-bottom:40px;
}

.sectionbar {
width:100%;
height:80px;
position: relative;
background-size:cover;
background: url(../img/sectionbar_bg.svg) top right no-repeat #E2E4EC;
display:block;
}



#news section {
float:none;
width:100%;
background:#FFF;
}
#news section h1 {
font-size:0;
margin:0 45px 20px 0;
width:28%;
}
#news .photo {
display:none;
}

#news section ul {
overflow:hidden;
font-size: 12px;
margin-right:35px;
}
#news section ul li{
margin-bottom:8px;
padding-bottom:5px;
border-bottom:dotted 1px #CCC;
}


.instagramBox {
padding-right:30px;
padding-left:30px;
font-size:13px;
}
.instagramBox h1 {width:42%;margin-bottom:15px;}
.instagramBox h1 img {width:100%;}
.instagramBox a {padding:15px 0;}


#access {
background-color:#EEEDE3;
}
#access .photo {
float:none;
margin-bottom:40px;
margin:0 auto;
width:88%;
}
#access .photo img {
margin-bottom:20px;
display:block;
width:100%;
}
#access .photo img:first-child {
}

#access dl {
margin-bottom:20px;
margin-top:40px;
margin:0 auto;
width:88%;
}
#access dt {
margin-bottom:6px;
}
#access dt img {
width:50%;
}
#access dd {
margin-right:10px;
margin-bottom:20px;
font-size: 13px;
}
#access section ul {
margin-bottom:25px;
}
#access section ul li {
margin-bottom:10px;
display:block;
padding:10px 4%;
font-size:1.4rem;
color:#95772f;
border:1px solid #95772f;
vertical-align: top;
}

#footer .copyright {
width:100%;
display:block;
text-align:center;
color:#4F636B;
margin:10px 0;
padding:10px 0 60px;
font-size:11px;
}


.instagram_photolist {max-width: 800px;overflow: hidden;margin:30px auto;padding:0;position: relative;z-index: 1;width:100%;}
.instagram_photolist li{display:block;margin:2px 12px 0;width:41.20%;height:auto;float:left;}
.instagram_photolist li a {display:block;margin: 0 auto;text-align:center;padding:0;}
.instagram_photolist li a img {width: 100%;height: auto;padding:5px;border:solid 1px #CCC;}
.instagram_photolist li span {display: block;text-align: center;padding: 10px 0 0 0;}




}




@media screen and (max-width:1200px) and (min-width:641px) {
#menu1 > div > .photo img,
#menu3 > div > .photo img  {
position:absolute;
left:50%;
margin-left:-160px;
}
#about > .photo > img,
#menu2 > .photo > img {
position:absolute;
right:0;
}

}



@media screen and (max-width:641px) and (min-width:400px) {
#menu1 > div > .photo div,
#menu3 > div > .photo div  {
height:530px;
}
#menu1 > div > .photo img,
#menu3 > div > .photo img {
min-width:320px;
margin-left:-160px;
}
#about > .photo,
#menu2 > .photo {
height:530px;
}
#about > .photo > img,
#menu2 > .photo > img {
position: absolute;
height:530px;
right:0;
}
#access dt img {
width:50%;
}
}