@charset "utf-8";
/* CSS Document */
/*font-family: "Lato", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/

html, body, div, span, object, iframe, h1, h2, h3, h4, p, a, img, strong, tt, dl, dt, dd, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, tr, th, td, article, aside, canvas, embed, figure, figcaption, footer, header, nav, section, time, video { border: 0; color: #8c8c8c; list-style: none; margin: 0; padding: 0; vertical-align: baseline; }

h2 { font-size: 20px; }

a { color: #8c8c8c; text-decoration: none; }

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

.clear { clear: both; }

/* html5 */
aside, details, figcaption, figure, footer, header, nav, section { display: block; clear: both; }

body { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝"; }

body#home,
body#gallery_page,
body#news_page{ background-color: #000; }

.yu_outbox { }

.yu_box { margin: 0 auto; max-width: 1200px; }
.yu_box > img,
.yu_box > a > img { width: 100%; display: block; }
.yu_box > p { padding: 36px 0 44px; }
.yu_box > p.news_date { display: inline-block; padding: 40px 0 0; }
.yu_box > h1 { display: inline-block; padding: 40px 20px 0 0; }
.yu_box h2 { text-align: center;}

.header_box { height: 46px; padding-top: 62px; }
.header_box > h1.title { display: inline-block; font-size: 16px; width: 20%; }
.header_box > p { display: inline-block; font-size: 13px; width: 79%; text-align: right; }

.header_menu { background: linear-gradient(#000f25, #00123b); height: 172px; padding-left: 64px;  }
.header_menu a { display: inline-block; font-size: 14px; }
.header_menu img { display: inline-block; padding-right: 64px; height: 172px; width: 112px; }
.header_menu img.sp { display: none; }
.header_menu ul { display: inline-block; height: 172px; min-width: 112px; vertical-align: top; }
.header_menu ul li { display: inline-block; height: 40px; line-height: 40px; padding: 66px 64px 66px 0; }
.header_menu ul li:last-child {  padding-right: 5px; }

#txt_contents { padding: 40px 5%; text-align: center; }
#txt_contents p { font-size: 14px; line-height: 200%; padding: 24px 0; }

.news_box { width: 1116px; }
#news { background: linear-gradient(#000f25, #00123b); margin-bottom: 94px; padding: 64px 0 28px 64px; }
#news h2 { margin-bottom: 56px; padding-right: 64px; }
#news_page #news h2 { margin-bottom: 16px; }
#news dl { display: inline-block; height: 320px; margin-right: 40px; margin-bottom: 36px; vertical-align: top; width: 238px; }
#news dl dt,
#news dl dd { display: inline-block; width: 238px; }
#news dl dt img,
#news dl dd img{ width: 100%; vertical-align: bottom;}
#news dl dt { background: #fff; }
#news dl dd { background: #232e40; line-height: 21px; min-height: 60px; padding: 18px 0 0; text-align: center; }
#news dl:hover dt img { opacity: 0.8; }
#news dl:hover dd a { color: #fff; text-decoration: underline; }
#news > a { display: block; padding: 0 64px 20px 0; text-align: right; }
#home #news > a { text-align: center; font-size: 20px; line-height: 150%; padding-top: 16px; padding-bottom: 28px; }

#concept { background: linear-gradient(#000f25, #00123b); margin-bottom: 94px; padding: 64px 5% 40px; text-align: center; }
#concept h2 { margin-bottom: 24px; }
#concept p { font-size: 14px; line-height: 200%; padding: 24px 0; }

#gallery { background: linear-gradient(#000f25, #00123b); margin-bottom: 94px; padding: 64px 0 24px 64px; }
#gallery h2 { margin-bottom: 56px; padding-right: 64px; }
#gallery ul {}
#gallery ul li { display: inline-block; height: 238px; margin: 0 40px 40px 0; vertical-align: top; width: 238px; }
#gallery ul li a { background: #fff; }
#gallery ul li a,
#gallery ul li a img { width: 100%; display: block; vertical-align: top; }
#gallery ul li a img:hover { opacity: 0.8; }

#access { background: linear-gradient(#000f25, #00123b); margin-bottom: 94px; padding: 64px 0 64px 64px;}
#access h2 { margin-bottom: 56px; padding-right: 64px; }
#access p { line-height: 200%; margin-bottom: 56px; text-align: center; }
.access_box { padding-right: 64px; }
.map { background: #232e40; padding: 64px 0 64px 64px; }
.map img { display: inline-block; width: 490px; vertical-align: top; }
.map_other { border-right: 1px solid #000e2c; display: inline-block; margin-right: 64px; padding-right: 64px; width: calc(100% - 682px); vertical-align: top; }
#access .map_other p { margin-bottom: 50px; text-align: left; }
.map_other a { background: #8c8c8c; border-radius: 2px; color: #000f25; display: inline-block; line-height: 170%; padding: 20px 5%; text-align: center; width: 100%; }
.map_other a.first { margin-bottom: 48px; }

#footer h2 { margin-bottom: 40px; }
#footer .footer_contents { background: linear-gradient(#000f25, #00123b); font-size: 14px; line-height: 170%; padding: 64px; text-align: center; }
#footer .footer_contents ul { padding: 0 5%; }
#footer .footer_contents ul li { display: inline-block; margin-right: 24px; }
#footer .footer_contents ul.sns { margin: 20px 5% 56px; }
#footer .footer_contents ul.sns li { display: inline-block; margin: 0 25px; }
#footer .footer_contents ul.sns li img { width: 50px; }
#footer .copyright { background: #232e40; height: 160px; line-height: 160px; text-align: center; }

@media screen and (max-width: 1200px) {
    .yu_box { width: 100%; }
    .yu_box > p { padding: 36px 5% 44px; }
    .yu_box > p.news_date,
    .yu_box > h1 { padding-left: 5%; padding-right: 0; }
    
    .header_box { padding: 24px 0 12px; height: auto; }
    .header_box > h1.title { padding: 0 5%; width: 90%; text-align: center;}
    .header_box > p { font-size: 10px; line-height: 140%; padding: 12px 5% 0; width: 90%; text-align: center; }
    .header_menu ul li { padding: 66px 48px 66px 0; }
        
    #news { margin-bottom: 40px; padding: 40px 5% 5%; }
    #news h2 { margin-bottom: 40px; padding-right: 0; }
    #news_page #news h2 { margin-bottom: 2px; }
    .news_box { width: 100%; }
    #news dl { margin-bottom: 4%; height: auto; }
    #news dl:nth-child(odd)  { margin-right: 4%; width: 48%; }
    #news dl:nth-child(even)  { margin-right: 0%; width: 48%; }
    #news dl dt, #news dl dd { width: 100%;}
    #news > a { display: block; padding: 0 0 20px; }
    #home #news > a { padding-top: 32px; padding-bottom: 24px; }
    
    #gallery, #access, #link { margin-bottom: 10%; padding: 40px 5% 60px; }

	#gallery h2 { padding-right: 0;}
    #gallery ul li { margin-right: 4%; margin-bottom: 6%; height: auto; width: 22%; }
    #gallery ul li:nth-child(4),
    #gallery ul li:nth-child(8){ margin-right: 0; }
    
    .map { padding: 40px 5% 60px; }
    .access_box { padding-right: 0; }
    #access h2 { margin-bottom: 40px; padding-right: 0; }
    
    #footer .footer_contents { padding: 40px 5% 60px; }
}
@media screen and (max-width: 1100px) {
    .fixed { left: 0; position: fixed; top: 0; width: 100%; z-index: 1010; }
    
    .header_menu { height: 80px; padding-left: 0; text-align: center; }
    .header_menu img { margin: 10px 0 0; padding-right: 0; height: 60px; width: auto; }
    .header_menu img.sp { display: inline-block; }
    .header_menu img.pc { display: none; }
    .header_menu a { height: auto;}
    .header_menu_inbox { height: 80px; position: relative; }
    .header_menu_inbox ul {
        background: #232e40;
        background-image: url(../img/bg_nagi.jpg);
        background-size: 100% auto;
        background-position: center bottom; 
        height: auto;
        padding: 40px 0;
        position: absolute;
        right: 0;
        top: 80px;
        width: 50%;
    }
    .header_menu_inbox ul li {
        padding: 0;
        height: 60px;
        line-height: 60px;
        width: 100%;
    }
    .header_menu_inbox ul li a {
        width: 100%;
    }
    .header_menu .header_menu_inbox img.menu { position: absolute; right: 1.4%; top: 0; }
    .header_menu .header_menu_inbox img.open,
    .header_menu .header_menu_inbox img.close { display: none; }
    .header_menu .header_menu_inbox ul.close { display: none; }
    .header_menu .header_menu_inbox img.visible,
    .header_menu .header_menu_inbox ul.visible { display: block; }
    
    .map_other { border: 0; margin: 0; padding: 0; width: 100%; }
    .map_other a { margin-bottom: 56px; padding: 20px 5%; width: 90%;}
    .map img { margin: 0 20%; width: 59%; }
    
    #footer .copyright { font-size: 12px; height: auto; line-height: 20px; padding: 48px 5%; text-align: center; }
}
@media screen and (max-width: 900px) {
    .map img { margin: 0 10%; width: 79%; }
}
@media screen and (max-width: 599px) {
    .header_box > h1.title { text-align: left;}
    .header_box > p { text-align: left; }
    .header_menu_inbox ul { width: 100%; }
    
    #txt_contents { padding: 20px 5% 24px; }
    #txt_contents p { font-size: 12px; line-height: 140%; padding: 12px 0; text-align: left; }
    
    #news dl dd { font-size: 14px; line-height: 120%; padding: 18px 5% 0; width: 90%; }
    
    #concept { margin-bottom: 48px; padding: 40px 5% 24px; }
    #concept p { font-size: 12px; line-height: 140%; padding: 12px 0; text-align: left; }
    
    #gallery { padding: 40px 5% 24px; }
    #gallery h2 { margin-bottom: 36px; }
    
    #access { padding: 40px 5% 24px; }
    #access h2 { margin-bottom: 32px; }
    #access p { font-size: 12px; margin-bottom: 40px; }
    #access .map_other p { margin-bottom: 24px; }
    .map { padding: 40px 5%; }
    .map img { margin: 0 5%; width: 89%; }
    .map_other a { margin-bottom: 36px; }
    .map_other a.first { margin-bottom: 48px; }
    
    #footer .footer_contents { font-size: 12px; text-align: left; }
    #footer .footer_contents ul { padding: 0; }
    #footer .footer_contents ul.sns { text-align: center; }
}
@media screen and (max-width: 374px) {
    #news dl dd { font-size: 12px; }
    
}