@charset "utf-8";

*{color:#222222;}
html{background:#f6f6f6;}
header, footer{width:100%; max-width:1600px; min-height:40px; margin:0 auto; background:#f6f6f6; }
.inner{width:calc(100% - 80px); padding:20px 40px 10px 40px;}

.bold{font-weight:bold;}

h1{font-size:36px;}
h2{font-size:32px;}
h3{font-size:26px;}
h4{font-size:24px;}
p, dd{font-size:20px;}
dt{font-size:24px;}

@media screen and ( max-width:816px ){
p{text-align:justify; line-height:1.4;}
h1{font-size:36px;}
h2{font-size:4.8vw;}
h3{font-size:4.4vw;}
h4{font-size:4.0vw;}
p, dd{font-size:3.4vw;}
dt{font-size:3.8vw;}
}

#main01 .lh20{line-height:3.0;}


.inner{width:calc(100% - 40px); padding:10px 20px 10px 20px;}
}

header{position:relative;}
#top .logo_area{width:33%;}
.logo_area{width:20%;}
@media screen and ( max-width:816px ){.logo_area{margin-top: 0px;}}

header .flcon_b > div span#title_none{display:none;}


@media screen and ( max-width:816px ){
.logo_area{width:37%;}
#top .logo_area{width:50%;}

}

.logo_area h1 img{width:calc(100% - 20px);}
.contact_area{width:24%; margin-top:30px;}
@media screen and ( max-width:816px ){
.contact_area{margin-top:8px; margin-right:13%;}
#top_page .contact_area{margin-top:-5px; margin-right:13%;}
}

footer .contact_area{margin-top:0px;}

@media screen and ( max-width:816px ){.contact_area{width:37%; }}

.contact_area h2 img{width:100%;}

#contact_btn{position:absolute; top:0; right:8%; font-size:80%; letter-spacing:3px;}
#contact_btn > div{color:#fff; background:#555; border-radius:0 0 5px 5px; padding:5px 15px; display:inline-block; margin:0 10px;}
#contact_btn > div a{color:#fff; txt-decoration:none;}

#wrapper{background:#f6f6f6; padding-bottom:0px;}

#main_img{position:relative;}
#main_img .comment{
    position: absolute;
    bottom: 10%;
    left: 0px;
    background: #555;
    padding: 10px 20px;
}

.seikotsu #main_img .comment{background:rgba(85, 85, 85, 0.8);}

#main_img .comment h2{color:#fff; line-height:2.1;}


.more{padding:3px 10px; font-weight:bold; font-size:80%; text-align:right;}

.logo_area h2 {
    color: #555;
    font-size: 2.85vw;
    font-weight: 800;
    letter-spacing: 2px;
}
@media screen and ( max-width:816px ){.logo_area h2 {font-size: 4.25vw;}}
@media screen and ( min-width:1400px ){.logo_area h2 {font-size: 38px;}}

nav{
background: #333333; /* Old browsers */
background: -moz-linear-gradient(top, #333333 0%, #666666 50%, #333333 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #333333 0%,#666666 50%,#333333 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #333333 0%,#666666 50%,#333333 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#333333',GradientType=0 ); /* IE6-9 */
}
nav > div{width:19%; text-align:center; padding-top:5px; padding-bottom:5px;}

nav a, nav a:link, nav a:visited{color:#efefef;}



.swiper-slide h2{font-size:24px; line-height:1.4;}
@media screen and ( max-width:816px ){
.swiper-slide h2{font-size:3.8vw; line-height:1.4;}
}

/*スライダー*/
/*3枚表示の場合*/
#top_slider{width:100%; max-width:1300px; height: 31.2vw; max-height:600px; margin:10px auto 40px auto;}
/*1枚表示の場合*/
/*#top_slider{width:80%; max-width:1200px; margin:10px auto 80px auto;}*/

.display_none{display:none;}

#top_slider .swiper-container{width:100%; max-width:100%; margin:0 auto;}
@media screen and ( max-width:816px ){
}
#top_slider .swiper-container .swiper-slide img{width:100%; max-width:100%; margin:0 auto;}

.swiper-slide{position:relative; height:31.2vw; max-height601px;}

.swiper-wrapper{height:25vw; max-height601px;}
.swiper-slide .slider_comment{position:absolute; color:#fff; font-weight:100;}
.swiper-slide .sl_lt{position:absolute; top:15px; left:10px;}
.swiper-slide .sl_lb{position:absolute; bottom:15px; left:10px;}
.swiper-slide .sl_rt{position:absolute; top:15px; right:20px;}
.swiper-slide .sl_rb{position:absolute; bottom:15px; right:20px;}

.swiper-slide h2, .swiper-slide h4, .swiper-slide p{color:#fff; text-shadow:1px 1px 1px #666, -1px 1px 1px #666,1px -1px 1px #666,-1px -1px 1px #666;}

@media screen and ( max-width:816px ){
#top_slider{height: 62vw;}
#top_slider .swiper-slide{height:62vw;}
#top_slider .swiper-wrapper{height:62vw;}
}

#tra_time{width:28em; margin:0 auto 60 auto;}
@media screen and ( max-width:816px ){#tra_time{width:15em;}}

article{width:98%; max-width:1100px; margin:50px auto 40px auto;}
#main01{width:90%; max-width:800px;  margin;50px auto 40px auto;}
@media screen and ( max-width:816px ){article{margin-top:30px;}}
#main01 h2{letter-spacing:5px; font-size:38px; margin-bottom:30px; font-weight:bold;}
#main01 h3{letter-spacing:1px; font-size:22px; margin-bottom:30px; margin-top: 40px;}
@media screen and ( max-width:816px ){
#main01 h2{font-size:6.4vw;}
#main01 h3{font-size:4.8vw;}
}

#main01 p{line-height:1.4; letter-spacing:1px;}

#main01 table{line-height:1.8; width:80%; max-width:600px; margin:30px auto;}
#main01 table th, #main01 table td{text-align:center; padding-top:10px; padding-bottom:10px;}
#main01 table .p_menu01{width:59%;}
#main01 table .p_menu03{width:25%;}
#main01 table .p_menu04{width:16%;}
@media screen and ( max-width:816px ){
#main01 table{font-size:3.7vw; line-height:1.8; width:100%; max-width:700px; margin:30px auto;}
#main01 table th, #main01 table td{font-size:3.15vw;}
}

#main02 > div{width:calc(24% - 20px); padding:10px;}
#main02 > div > div.img_area img{width:100%;}

#main02 > div > div.img_area{position:relative;}
#main02 > div > div.img_area h3{position:absolute; bottom:5px; left:5px; color:#fff; font-weight:100;
text-shadow:1px 1px 1px #333, -1px 1px 1px #333,1px -1px 1px #333,-1px -1px 1px #333;}
@media screen and ( max-width:816px ){
#main02 > div{width:calc(49% - 12px); padding:6px;}
}


#main03{width:90%; max-width:800px; margin-bottom:60px;}
#main03 h2{letter-spacing:5px; font-size:38px; margin-bottom:30px; font-we4ight:bold;}
@media screen and ( max-width:816px ){#main03 h2{font-size:6.4vw; letter-spacing:3px;}}


#main03 .date{width:9em; display:inline; margin-right:3em; line-height:2.5;}
#main03 .news{width:calc(100% - 12em); display:inline; line-height:2.5;}
@media screen and ( max-width:816px ){
#main03 .date{width:12em; display:block;}
#main03 .news{width:90%; display:block;}
}

#main04 .access_1{margin-top:30px; margin-bottom:30px;}
#main04 .inner{width:70%; max-width:500px; margin:0 auto;}
#main04 .inner p{line-height:1.8; font-size:110%;}
#main04 .access_1 h4 img{width:100%;}



header .flcon_b > div span{color:#fff;}

footer .inner{max-width:1100px; margin:0 auto;}
footer .flcon_b > div span{color:#fff;}
@media screen and ( max-width:816px ){
footer{padding-bottom:40px;}
}

#btn_yoyaku{width:80px; position:fixed; bottom:5px; right:20px;}
#btn_yoyaku img{width:100%;}
@media screen and ( max-width:816px ){

}

.access_1 h4{width:45px;}
.access_1 p{width:calc(95% - 70px); margin-left:15px; text-align:left;}

#footer_allout{width:75%; margin:5px auto 5px 0;}
@media screen and ( max-width:816px ){
#footer_allout img{width:100%;}
}