@charset "UTF-8";
/* CSS Document */
#contents_wrap { overflow: hidden;}
#main_img { background: url("../../access/img/tit.jpg") no-repeat center center; background-size: cover;}
#contents_wrap #breadcrumb { margin-bottom: 0;}
section { padding:50px 0;}
#lead_col .box_txt { top:0; margin-left:200px; margin-bottom:0; height:500px; width:120px;}
#lead_col h2 span.wbr { display: inline-block; background:#fff; }
#lead_col h2 span.wbr:nth-of-type(2){margin-top:200px;}

section h2:not(.v_rl) { font-size: 24px; margin-bottom:40px; text-align: center;}
section h2 span.en { color:#b2a9a5; display: block; font-size:75px; font-family: garamond-premier-pro, serif; font-weight: 400; font-style: normal; font-variant-caps: small-caps; 
                margin-top:-10px;line-height: 1; }
@media screen and (max-width: 600px) {
                section { padding:30px 0;}
                #lead_col .box_txt { margin-left:auto; height:auto; width:100%;}
                #lead_col h2 span.wbr { display: block; height:auto;}
                #lead_col h2 span.wbr:nth-of-type(2){margin-top:0;}
                section h2:not(.v_rl) { font-size:24px; margin:0 auto 20px auto; width:90%;}
                section h2 span.en { font-size:50px;}
                
                
}

.box_gmap { height:500px;}
.box_route{ display: -webkit-flex; display: -ms-flex; display: flex; justify-content: space-between; margin: 0 auto; width: 1100px;}
.route { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; position: relative; text-align: center; }
.route h3 { padding: 10px 2%; background:#f1f0ee; font-size: 16px; position: relative;}
.route ul{ display: flex;
                -webkit-box-orient: vertical;-webkit-box-direction: normal;flex-direction: column;-webkit-box-pack: justify;justify-content: space-between;}
.route li { padding: 10px 2%;}
.route .point { border:1px solid #916D56; font-size: 16px;}
.route .goal { background: url(../img/btn_bg1.png) #508674; color: #fff; font-size: 16px;}
.route .time,
.route .time2{ margin-left:30%; border-left:5px solid #916D56; padding:20px 2%; height:100%; width:50%; text-align: left;}
.route .time2 b { font-size:14px; font-weight: bold; color:rgba(160,28,30,1.00); margin-left:15px;}
.box_route + ul { display: flex; flex-wrap: wrap; margin:60px auto; width: 770px;}
.box_route + ul li { width:-webkit-calc(50% - 20px); width:calc(50% - 20px); margin:10px 10px;}
.box_route + ul li a { border:1px solid; border-radius: 30px; display: block; padding: 10px 0; text-align: center; width:100%;}
.box_route + ul li a:hover { background: #46230d; color:#fff; }
.box_route + ul li a::before {content: "»"; font-size: 20px; margin-right: 5px;}
.note { clear: both; margin: 0 auto; width:600px;}
.note li { padding:8px 20px;}

@media screen and (max-width: 600px) {   
                .box_gmap { height:300px;}
                section { margin:0 auto; padding:25px 0; width:92%;}
                .box_route {display: block; width:100%;}
                .route { display: block; margin:0 auto 30px; width:90%;}
                .route h3::after{ content:"»";display: inline-block; font-size: 24px; margin-right: 5px; transform:rotate(90deg); position: absolute; right:20px; top:5px;}
                .route h3.active::after{transform:rotate(-90deg);}
                .route ul{ display: block; padding-bottom:50px;}
                .route .time,
                .route .time2{ margin-left:10%; height:auto; padding:10px 2%; width:90%;}
                .box_route + ul {margin:30px auto; width:80%;}
                .box_route + ul li {margin:10px 0; width:100%;}
                .box_route + ul li a { padding: 5px 0;}
                .note { width:100%;}
                .note li { padding:8px 2%;}
}
/*color: transparent;*/
#sec1 .route { width:530px;}
#sec1 .route:nth-of-type(1) .point { background:#fff; position: relative; width:1080px; z-index:8;}
#sec1 .route:nth-of-type(1) .goal{ position: relative; width:1080px; z-index: 8;}
#sec1 .route:nth-of-type(1) .time2 { color: transparent; border-color: transparent;}
#sec1 .route:nth-of-type(2) .time2 { margin-left:-30px; width:50%;}
#sec2 .route { width:350px;}
#sec2 .route:nth-of-type(2) .point { background:#fff; width:710px; position: relative; z-index:8;}
#sec2 .route:nth-of-type(1) .goal{ width:1080px; position: relative; z-index: 8;}
#sec2 .route:nth-of-type(2) .time2 {color: transparent; border-color: transparent;}
#sec2 .route:nth-of-type(2) .time2 b{ color: transparent;}
#sec2 .route:nth-of-type(3) .time2 { margin-left:-20px;}

@media screen and (max-width: 600px) {
                #sec1 .route,
                #sec2 .route { margin:0 auto 30px;width:90%;}
                #sec1 .route:nth-of-type(1) .point,
                #sec1 .route:nth-of-type(1) .goal,
                #sec2 .route:nth-of-type(2) .point,  
                #sec2 .route:nth-of-type(1) .goal{ width:auto;}
                #sec1 .route:nth-of-type(2) .time2,
                #sec2 .route:nth-of-type(3) .time2{ margin-left:10%; width:80%;}
                #sec1 .route:nth-of-type(1) .time2,
                #sec2 .route:nth-of-type(2) .time2{color: #46230d; border-color: #916D56; }
                #sec2 .route:nth-of-type(2) .time2 b{ color:rgba(160,28,30,1.00);}
                #sec2 .route .time:first-of-type {height:auto;padding:10px 2%;}
}

#sec3 {clear:both; padding: 0 0 40px; }
#sec3 .acc_cont{ margin: 0 auto 0; width: 1100px;}
#sec3 dl { float:left; margin:0 2% 30px 0; width:48%; }
#sec3 dt { float:left; font-size:24px; padding:0 15px 20px 15px;}
#sec3 dd { margin-bottom:15px; padding-left:8rem; }
#sec3 dd dl { width:100%;}
#sec3 dd dt { border:1px solid #916D56; border-radius: 3px; float:none; font-size:15px;  padding:2px 0; margin-bottom:20px; text-align: center; width:12em; }
#sec3 dd dd { margin-left:30px; padding-left:0; }
#sec3 dd dd b { font-size:18px; font-weight: 600; letter-spacing: 2px;}
#sec3 dd dl div { padding:0 0 30px 40px; font-size:13px;}
#sec3 dd dl li { padding-left:1em; text-indent: -1em;}


#sec3::before,
#sec2::before { content:""; background:#916D56; display: block; margin: 0 auto 30px auto; height:1px; position: relative;top:-25px; width:90%; }

@media screen and (max-width: 600px) {
                #sec3 .acc_cont{ margin:0 auto; width: 90%;}
                #sec3 h2 span.en {font-size:46px;}
                #sec3 dl { float:none; margin:0 0 30px 0; width:100%; }
                #sec3 dt { border:1px solid #916D56; float:none; margin-bottom:10px; padding:0; text-align: center; font-size:16px;} 
                #sec3 dd { padding-left:0; }
                #sec3 dd dl {}
                #sec3 dd dt { border:0; border-radius: 0; margin-right:5px; padding-left:15px; position: relative; text-align: left; width:55%;}
                #sec3 dd dt::before { content:""; position: absolute; left:0; top:40%; 
                                    border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 12px solid rgba(70,35,13,1);; }
                
}
@media screen and (max-width: 321px) {
                #sec3 h2 span.en {font-size:20px;}
                #sec3 h2 span.wbr { display: block;}
}



