.c2w_nav { width:78.8vw; margin:4.5vw auto auto auto; position:relative; user-select: none; z-index: 9;}
.c2w_nav .c2w_head { padding:10px 0; background:rgba(255,255,255,0.8); color:#00205b; text-align:center; font-size:16px;}
.thumb .c2w_head { display:none;}
.c2w_nav .c2w_menu { display:flex; align-items:center; justify-content:center; gap:12%; z-index: 11; position: relative; background:#FFF;}
.c2w_nav .c2w_menu a:link, .c2w_nav .c2w_menu a:visited {  padding:16px 30px 16px 10px; font-size:16px; font-weight:700; color:#333; text-decoration:none; position:relative; letter-spacing: 1.5px; transition: all 0.3s ease-in-out;}
.c2w_nav .c2w_menu a:before { content: ''; position: absolute; top: 20px; right: 10px; width: 7px; height: 7px; border-top: 2px solid #333; border-right: 2px solid #333; transform: rotate(135deg); transition: all 0.3s ease-in-out;}
.c2w_nav.thumb { position:fixed; padding:0 10.6vw; left:0; margin-top:auto; transition: top 0.2s linear; box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1);}
.c2w_nav.thumb .c2w_pop { width:78.8vw; left:10.6vw;}

.c2w_nav .c2w_menu.open { box-shadow: 0px 5px 8px rgba(0,0,0,0.1);}
.c2w_nav .c2w_menu a:hover { color:#00205b;}
.c2w_nav .c2w_menu a:hover::after { position:absolute; content:''; left:0; bottom:8px; width:100%; height:2px; background:#00205b; overflow:hidden;}
.c2w_nav .c2w_menu a:hover:before { border-top: 2px solid #00205b; border-right: 2px solid #00205b;}

.c2w_nav .c2w_menu a:first-child { padding-right:10px;}
.c2w_nav .c2w_menu a:first-child:before { display:none;}

.c2w_nav .c2w_menu .active:link, .c2w_nav .c2w_menu .active:visited { color:#00205b;}
.c2w_nav .c2w_menu .active::after { position:absolute; content:''; left:0; bottom:8px; width:100%; height:2px; background:#00205b; overflow:hidden;}
.c2w_nav .c2w_menu .active:before { transform: rotate(315deg); top:24px;border-top: 2px solid #00205b; border-right: 2px solid #00205b;}

.nav1_c1::-webkit-scrollbar,.nav2_c1::-webkit-scrollbar,.nav3_c1::-webkit-scrollbar { width:6px;}
.nav1_c1::-webkit-scrollbar-thumb,.nav2_c1::-webkit-scrollbar-thumb,.nav3_c1::-webkit-scrollbar-thumb { background: #27509b; border-radius: 4px;}
.nav1_c1::-webkit-scrollbar-thumb:hover,.nav2_c1::-webkit-scrollbar-thumb:hover,.nav3_c1::-webkit-scrollbar-thumb:hover { background: #27509b;}

.c2w_pop { display:none; position:absolute; left:0; width:100%; background:#FFF; height:55vh; min-height:350px; z-index: 10; letter-spacing: 1px; user-select: none; box-shadow: 0px 10px 10px rgba(0,0,0,0.1);}
.c2w_pop .pop_nav1,.c2w_pop .pop_nav2 { width:33.33%; display:flex; align-items: flex-start; justify-content: flex-start; flex-direction: column; height:100%; position:relative; background:#FFF; z-index: 12;}
.c2w_pop::after { content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(to bottom, rgba(0, 0, 0, 0.1) -3%, transparent 3%); pointer-events: none; z-index: 13;}
.c2w_pop .pop_nav3 { width:33.34%; display:flex; align-items: flex-start; justify-content: flex-start; flex-direction: column; height:100%; position:relative;}
.c2w_pop .pop_nav2::after, .c2w_pop .pop_nav3::after { content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(to right, rgba(0, 0, 0, 0.1) -3%, transparent 3%); pointer-events: none; z-index: 13;}

.nav1_c1 { display:flex; align-items: flex-start; justify-content: flex-start; flex-direction: column; width:90%; height:calc(100% - 45px);  margin:auto; padding:18px 5%; overflow-x:hidden; overflow-y:auto; margin-bottom:60px;}
.nav1_c1 a:link, .nav1_c1 a:visited { position:relative; display:block; width:calc(100% - 24px); padding:18px 24px; font-size:14px; font-weight:700; color:#333; text-decoration:none; transition: all 0.3s ease-in-out; margin-left:-12px; margin-bottom:1px; text-align: justify;}
.nav1_c1 a:hover { color:#27509b; background:#d4e7fa;}
.nav1_c1 a:link:before, .nav1_c1 a:visited:before { content: ''; position: absolute; top: 23px; right: 24px; width: 7px; height: 7px; border-top: 2px solid #333; border-right: 2px solid #333; transform: rotate(45deg); transition: all 0.3s ease-in-out;}
.nav1_c1 a:hover:before { border-top: 2px solid #27509b; border-right: 2px solid #27509b;}
.nav1_c1 .active:link, .nav1_c1 .active:visited { color:#27509b; background:#d4e7fa;}
.nav1_c1 .active:link:before, .nav1_c1 .active:visited:before { border-top: 2px solid #27509b; border-right: 2px solid #27509b;}


.nav2_c1 { display:flex; align-items: flex-start; justify-content: flex-start; flex-direction: column; width:90%; height:calc(100% - 45px);  margin:auto; padding:18px 5%; overflow-x:hidden; overflow-y:auto; margin-bottom:60px;}
.nav2_c1 a:link, .nav2_c1 a:visited { position:relative; display:block; width:calc(100% - 24px); padding:18px 24px; font-size:14px; font-weight:700; color:#333; text-decoration:none; transition: all 0.3s ease-in-out; margin-left:-12px; margin-bottom:1px; text-align: justify;}
.nav2_c1 a:hover { color:#27509b; background:#d4e7fa;}
.nav2_c1 a:link:before, .nav2_c1 a:visited:before { content: ''; position: absolute; top: 23px; right: 24px; width: 7px; height: 7px; border-top: 2px solid #333; border-right: 2px solid #333; transform: rotate(45deg); transition: all 0.3s ease-in-out;}
.nav2_c1 a:hover:before { border-top: 2px solid #27509b; border-right: 2px solid #27509b;}
.nav2_c1 .active:link, .nav2_c1 .active:visited { color:#27509b; background:#d4e7fa;}
.nav2_c1 .active:link:before, .nav2_c1 .active:visited:before { border-top: 2px solid #27509b; border-right: 2px solid #27509b;}


.nav3_c1 { display:flex; align-items: flex-start; justify-content: flex-start; flex-direction: column; width:90%; height:calc(100% - 45px);  margin:auto; padding:18px 5% 70px; overflow-x:hidden; overflow-y:auto; margin-bottom:60px;}
.nav3_c1 a:link, .nav3_c1 a:visited { position:relative; display:flex; gap:8px; width:calc(100% - 72px); padding:18px 74px 18px 24px; font-size:16px; font-weight:700; color:#333; text-decoration:none; transition: all 0.3s ease-in-out; margin-left:-12px;flex-direction: column; text-align: justify;}
.nav3_c1 a:hover { color:#27509b; background:#d4e7fa;}
.nav3_c1 a:link:before, .nav3_c1 a:visited:before { content: ''; position: absolute; top: 25px; right: 24px; width: 7px; height: 7px; border-top: 2px solid #333; border-right: 2px solid #333; transform: rotate(45deg); transition: all 0.3s ease-in-out;}
.nav3_c1 a:hover:before { border-top: 2px solid #27509b; border-right: 2px solid #27509b;}
.nav3_c1 .active:link, .nav3_c1 .active:visited { color:#27509b; background:#d4e7fa;}
.nav3_c1 .active:link:before, .nav3_c1 .active:visited:before { border-top: 2px solid #27509b; border-right: 2px solid #27509b;}

.nav3_c1 .t1 { padding:20px 24px 14px 34px; width:calc(86% - 20px); border-bottom:2px solid #fce500; margin-bottom:10px; margin-left:calc(-5% - 1px); text-align: left; color:#333;}

.nav3_c1 span { font-size:14px; color:rgba(51, 51, 51, 0.5); font-weight:300; padding-left:12px; letter-spacing: 1px;}


.btn-all { position:absolute; bottom:14px; right:6%;}
.nav1_c1 .btn-all a:link, .nav1_c1 .btn-all a:visited { padding-right:28px; font-size:14px;}
.nav1_c1 .btn-all a:hover { background:transparent;}
.nav1_c1 .btn-all a:link:before, .nav1_c1 .btn-all a:visited:before { top:23px;}

.nav2_c1 .btn-all a:link, .nav2_c1 .btn-all a:visited { padding-right:28px; font-size:14px;}
.nav2_c1 .btn-all a:hover { background:transparent;}
.nav2_c1 .btn-all a:link:before, .nav2_c1 .btn-all a:visited:before { top:24px;}

.nav3_c1 .btn-all a:link, .nav3_c1 .btn-all a:visited { padding-right:28px; font-size:14px; width: calc(100% - 28px);}
.nav3_c1 .btn-all a:hover { background:transparent;}
.nav3_c1 .btn-all a:link:before, .nav3_c1 .btn-all a:visited:before { top:24px;}


.pop_nav1 .head1 { padding:32px 0 8px 12px; font-size:16px; font-weight:700; color:#27509b; margin-left:5%; background:url(../img/1.png) 0 bottom no-repeat; background-size:auto 105%;}
.pop_nav2 .head1 { padding:32px 0 8px 12px; font-size:16px; font-weight:700; color:#27509b; margin-left:5%; background:url(../img/2.png) 0 bottom no-repeat; background-size:auto 105%;}
.pop_nav3 .head1 { padding:32px 0 8px 12px; font-size:16px; font-weight:700; color:#27509b; margin-left:5%; background:url(../img/3.png) 0 bottom no-repeat; background-size:auto 105%;}

.c2w_bg { display:none; position:fixed; background:rgba(0,0,0,0.8); top:0; left:0; width:100%; height:100%; z-index:8;}

.back-to-top { z-index:7!important;}
.swiper-pagination { z-index:7;}

.pop_nav_mobi { display:none;}

.kv .article .btn1a { width:4.86vw; color:#FFF; background:url(../img/btn1a.png) 0 0 no-repeat; background-size:contain;}
.bicycle .btn1a:hover { background:rgba(255,255,255,0.8); color:#333;}
.bicycle .btn1a span { background:transparent; padding-right:0;}
.bicycle .btn1a:hover span { background:transparent;}

.kv .article .btn1b { margin-top:auto; position:absolute; left:5.86vw; bottom:0; min-width: 228px;}
.kv .article .btn1b:before { content:''; position:absolute; top:0; left:15%; width:60%; height:100%; background:url(../img/btn1b.png) 0 center no-repeat; background-size:auto 40%;}
.bicycle .btn1b:hover {}
.bicycle .btn1b span { background:transparent; padding-left:17%; padding-right:0;}
.bicycle .btn1b:hover span { background:transparent; padding-left:17%; padding-right:0;}

@media (max-width: 1366px) {
.kv .article .btn1b { min-width: 200px;}
.kv .article .btn1b:before { left:12%;}
.bicycle .btn1b span { padding-left:16%;}
}

@media (max-width: 750px) {
    .c2w_nav { width:82%; padding:0; margin:30px auto;}
		.c2w_nav .c2w_head { padding:10px 5%;}
    .c2w_nav .c2w_menu { justify-content: space-between; align-items: stretch;flex-wrap:wrap; gap:0; margin-bottom:-10px; padding:10px 5% 0 5%;}
    .c2w_nav .c2w_menu a:link, .c2w_nav .c2w_menu a:visited { width:47%; text-align: center; background:#FFF; color:#00205b; border-radius: 4px; border:1px solid #00205b; margin-bottom:10px; padding:8px 0; font-size:16px; text-indent: -14px;}
    .c2w_nav .c2w_menu a:first-child { padding-right:0; text-indent:0;}
    .c2w_nav .c2w_menu .active::after { display:none;}
	
	.content h2 { margin-bottom:auto;}

    .c2w_nav .c2w_menu a:before { top:12px; right:42px;}
    .c2w_nav .c2w_menu .active:link, .c2w_nav .c2w_menu .active:visited { color:#FFF; background:#00205b;}
    .c2w_nav .c2w_menu .active:before { top:17px; transform: rotate(315deg); border-top: 2px solid #FFF!important; border-right: 2px solid #FFF!important;}

    .c2w_nav .c2w_menu a:hover:before {}
    .c2w_nav .c2w_menu a:hover::after { display:none;}
    .c2w_pop { overflow:hidden; top:50px; z-index: 12; box-shadow:0px 5px 8px rgba(0,0,0,0.1); height:65vh;}
    .c2w_pop .pop_nav1, .c2w_pop .pop_nav2, .c2w_pop .pop_nav3 { width:100%; box-shadow:none;}
    .c2w_pop .pop_nav2, .c2w_pop .pop_nav3 { display:none;}

    .pop_nav_mobi { display:none; position:absolute; top:0; left:0; width:88%; padding:0 6%; height:50px; line-height: 50px; background:#FFF; box-shadow: 0 2px 4px rgba(0,0,0,0.1); z-index: 13; overflow:hidden;}
    .pop_nav_mobi p { position:relative; display:flex; align-items: center; justify-content: flex-start; overflow:hidden; width:1000%; height:50px; padding-left:10px;
    object-fit: cover;
    object-position: left top;
    -webkit-mask: left top / contain;
    mask: center top / contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100vw 100vh;
    mask-size: 100vw 100vh;
    -webkit-mask-position: left top;
    mask-position: left top;
    -webkit-mask-image: linear-gradient(90deg, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 80%);
    mask-image: linear-gradient(90deg, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 80%);
    mix-blend-mode:normal;
    }
    .pop_nav_mobi a:link, .pop_nav_mobi a:visited { position:absolute; display:block;white-space: nowrap; overflow: hidden; font-size:14px; color:#333; text-decoration:none; line-height:50px; position:relative; padding:0 8px; letter-spacing: 1px;}
    .pop_nav_mobi p:before { content: ''; position: absolute; top: 20px; left: 2px; width: 7px; height: 7px; border-top: 2px solid #333; border-right: 2px solid #333; transform: rotate(-135deg);}

		.pop_nav_mobi a:link:after, .pop_nav_mobi a:visited:after { content: ''; position: absolute; bottom: 14px; left: 6px; width: calc(100% - 14px); height: 1px; background:#333;}

    .pop_nav_mobi a:link:before, .pop_nav_mobi a:visited:before { content:''; width:1px; height:14px; background:rgba(0, 0, 0, 0.8); position:absolute; top:20px; left:0;}
    .pop_nav_mobi a:first-child:before, .pop_nav_mobi a:first-child:visited:before { display:none;}

    .btn-all { right:calc(3% + 2px);}

    .nav1_c1 .btn-all a:link, .nav1_c1 .btn-all a:visited { border-bottom:none; width:36px;}
    .nav1_c1 .btn-all a:link:before, .nav1_c1 .btn-all a:visited:before { top:25px;}

    .pop_nav1 .head1 { margin-left:7%;}
    .nav1_c1 { width:86%; padding:10px 7%;}
    .nav1_c1 a:link, .nav1_c1 a:visited { border-bottom:1px solid #c5d0e4; margin-left:-6px; width:calc(100% - 12px); padding:20px 12px 20px 20px;}
    .nav1_c1 a:link:before, .nav1_c1 a:visited:before { right:16px;}

    .nav2_c1 .btn-all a:link, .nav2_c1 .btn-all a:visited { border-bottom:none; width:36px;}
    .nav2_c1 .btn-all a:link:before, .nav2_c1 .btn-all a:visited:before { top:25px;}

    .pop_nav2 .head1 { margin-left:7%;}
    .nav2_c1 { width:86%; padding:10px 7%;}
    .nav2_c1 a:link, .nav2_c1 a:visited { border-bottom:1px solid #c5d0e4; margin-left:-6px; width:calc(100% - 12px); padding:20px 12px 20px 20px;}
    .nav2_c1 a:link:before, .nav2_c1 a:visited:before { right:16px;}

    .nav3_c1 .btn-all a:link, .nav3_c1 .btn-all a:visited { border-bottom:none; width:36px;}
    .nav3_c1 .btn-all a:link:before, .nav3_c1 .btn-all a:visited:before { top:25px;}

    .pop_nav3 .head1 { margin-left:7%;}
    .nav3_c1 { width:86%; padding:0 7% 10px 7%; height:47vh;}
    .nav3_c1 a:link, .nav3_c1 a:visited { border-bottom:1px solid #c5d0e4; margin-left:-6px; width:calc(92% - 7px); padding:20px 30px 20px 20px;}
    .nav3_c1 a:link:before, .nav3_c1 a:visited:before { right:16px; top:22px;}

    .nav3_c1 .t1 { width:90%; font-size:16px; text-align: left; padding:34px 24px 14px 42px; margin-left: -30px; }

    .c2w_nav.thumb { width:90%; padding:10px 5%; left:0; margin-top:auto; transition: top 0.2s linear;}
    .c2w_nav.thumb .c2w_pop { width:100%; left:0;}
    .c2w_nav.thumb .c2w_menu a:link, .c2w_nav.thumb .c2w_menu a:visited { width:22%; padding:5px 0; text-indent:0}
    .c2w_nav.thumb .c2w_menu a::before {display:none;}
    .c2w_nav.thumb .c2w_menu a:hover::after {display:none;}
	
    .kv .article .btn1a { width:25vw;}
    .kv .article .btn1b { left:29vw; min-width:auto; padding:0 3vw 0 3.5vw;}
    .bicycle .btn1b span { padding-left:11%;}
    .kv .article .btn1b:before { background-size: auto 28%; top:-1px;}
    .bicycle .btn1b:hover span { padding-left:11%;}
}