@charset "utf-8";

#container{background: url('../img/main/main_bg01.png'), url('../img/main/main_bg02.png'); background-repeat: no-repeat; background-position: right top, left -40rem top 400rem;}
.sub_top{margin-top: 80rem;}
.sub_top h2{text-align: center; font-family: var(--gmark); font-size: 45rem; font-weight: 500;}
.loca{display: flex; align-items: center; justify-content: center; margin: 10rem 0 70rem;}
.loca a{font-size: 20rem; color: #121212; padding-right: 20rem; margin-right: 20rem; position: relative;}
.loca a::before{position: absolute; content: ""; background: url('../img/sub/sub_arrow.png') no-repeat; width: 15rem; height: 15rem; right: -5px; top: 9px;}
.loca a:last-child:before{display: none;}
.loca a.home{text-indent: -9999px; background: url('../img/sub/home.png') no-repeat center center; width: 17rem; height: 100%; background-size: contain; margin-right: 37rem;}
.loca a.home::before{right: -27px;}
.loca a:last-of-type{font-weight: 600; margin-right: 0; padding-right: 0;}


.sub_nav.ver3.white{background: var(--p_color); border-radius: 6rem; box-shadow: 3px 3px 10px rgba(0,0,0,0.2);}
.sub_nav.ver3 .depth1{padding: 0 20rem;}
.sub_nav.ver3.white .depth1 > li > a{padding: 10rem;}
.sub_nav.ver3 .depth1 > li > a::after{border-color: #fff;}
#content{padding: 50rem 0; }

.sub_tab li {flex: 1 1 0;  border: 1px solid #ddd; background: #fafafa; min-width: 0;}

@media (max-width: 1023px) {
    #container{background-image: none;}
    .sub_top{margin-top: 50rem;}
    .sub_top h2{font-size: 36rem;}
    .loca{margin: 10rem 0 30rem; flex-wrap: wrap;}
    .loca a{font-size: 18rem;}
    .loca a::before{top: 6px;}
}
@media (max-width: 600px) {
    .sub_top{margin-top: 32rem;}
    .sub_top h2{font-size: 32rem;}
    .sub_tab li {flex: 0 0 50%;}
}