/*
	Theme Name: JuntechTheme1
	Theme URI: 
	Description: 
	Version: 1
	Author: 
	Author URI: 
*/

/* Default: For Smart Phone */

/* Field Tab*/
.tabs {
    display: flex;
    justify-content: center;
    margin: auto;
    /*初期はスコープアウト*/
    display: none;
}

.tab {
    border: 1px solid #365334;
}
.tab:nth-child(1), .tab:nth-child(1)>button{
    border-radius: 5px 0px 0px 0px;
}
.tab:nth-child(2){
    margin: 0 -1px;
}
.tab:nth-child(3), .tab:nth-child(3)>button{
    border-radius: 0px 5px 0px 0px;
}
.tablinks {
    background-color: #eee;
    border: none;
    padding: 5.5px 7px;
    cursor: pointer;
    color: #365334;
    font-size: 16px;
    line-height:19px
}

.tablinks:hover {
    background-color: #ddd;
}

.tablinks.active {
    background-color: #365334;
    color: white;
}
.tab:has(.tablinks.active) {
    background-color: #365334;
}

.tabcontent {
    display: none;
    /* padding: 10px; */
    /* border: 1px solid #ddd; */
}

.tabcontent h3 {
margin-top: 0;
}

#tab1 .input-group-text{
    background-color: #365334;
    color: white;
    padding: 0.375rem 0.375rem;
}

#field-map{
    width: 45%;
    height:150px;
}

.field-list{
    width: 55%;
    height: 150px;
    overflow-x: scroll;
}

.list-card{
    color: #2B2527;
    background: white;
    padding: 5px;
    border: 1px solid #365334;
    overflow: auto;
}

.list-card-title{
    font-size: 12px;
    line-height: 15px;
    margin: 0.25rem 0;
}
.list-card-description{
    font-size: 10.5px;
    line-height: 12px;
    margin: 0;
}
.list-card-link{
    color: #365334;
    line-height: 10px;
}
.list-card-link>.material-icons{
    width: 20px;
    height: 20px;
}
.list-card-link>.icon-label{
    font-size: 10px;
    transform: scale(0.8);
}
.list-card-tags{
    list-style: none;
    margin: 0;
}
.list-card-tag{
    float: left;
    font-size: 10px;
    background-color: #365334;
    color: white;
    border-radius: 10px;
    padding: 0 5px;
    margin: 0 2px;
}
.list-card-tag.disabled{
    opacity: 0.7;
}

.map-contents{
    background-image: url(../../img/japan_map_2.png);
    background-size: 90%;
    background-repeat: no-repeat;
    background-position: center;
    height: 240px;
    width: 360px;
    position: relative;
}
.map-contents>.btn{
    position: absolute;
    border-radius: 5px;
    background-color: rgba(255,255,255,0.7);
    padding: 0.2rem 0.5rem;
    font-size: 12px;
    line-height: 14px;
    color: #365334;
}
.map-contents>.btn-hokkaido{
    border: 1.5px solid #004BBC;
    top: 12px;
    left: 291px;
    padding: 0.2rem 0.25rem;
}
.map-contents>.btn-tohoku{
    border: 1.5px solid #3376C5;
    top: 71px;
    left: 286px;
}
.map-contents>.btn-kitakanto{
    border: 1.5px solid #248EBC;
    white-space: nowrap;
    top: 118px;
    left: 266px;
}
.map-contents>.btn-minamikanto{
    border: 1.5px solid #009A75;
    top: 161px;
    left: 280px;
}
.map-contents>.btn-koshinetsu{
    background-color: rgba(201, 255, 212, 0.2);
    border: 1.5px solid #369E12;
    top: 75px;
    left: 237px;
    padding: 0.2rem 0.25rem;
}
.map-contents>.btn-hokuriku{
    border: 1.5px solid #73B900;
    top: 114px;
    left: 197px;
}
.map-contents>.btn-tokai{
    border: 1.5px solid #C9A500;
    top: 170px;
    left: 214px;
}
.map-contents>.btn-kinki{
    border: 1.5px solid #CE7C00;
    top: 152px;
    left: 156px;
}
.map-contents>.btn-chugoku{
    border: 1.5px solid #FA6120;
    top: 146px;
    left: 95px;
}
.map-contents>.btn-shikoku{
    border: 1.5px solid #DD4E68;
    top: 187px;
    left: 95px;
}
.map-contents>.btn-kyushu{
    border: 1.5px solid #B548D0;
    top: 169px;
    left: 17px;
    padding: 0.2rem 0.2rem;
}

.arms-toggle{
    /*初期はネットのみ*/
    display: none;
    margin: auto;
}
.arms-toggle>.btn-check{
    display: none;
}
.arms-toggle>.btn{
    width: 178.5px;
    border-radius: 0 5px 5px 0;
    border: 1px solid #365334;
    color: #365334;
    background-color: white;
    float: left;
    padding: 0.2rem 0.5rem;
}
.arms-toggle>.btn:nth-child(2){
    border-radius: 5px 0 0 5px;
}
/* チェックが入った入力のラベル */
.arms-toggle>.btn-check:checked + label {
    background-color: #365334;
    color: white;
}
.arms-genre-row{
    margin-top: -1px;
    background: white;
    overflow: hidden;
}
.arms-genre-card{
    height: 50px;
    border: 0.5px solid #365334;
    float: left;
    color: #365334;
    /* margin-left: -1px; */
}
.arms-genre-card:nth-child(2n){
    margin-left: -0.5px !important;
}
.arms-genre-card:hover{
    color: #365334;
}
.arms-genre-img-wrapper{
    background-size: cover;
}
.arms-genre-img-1{
    background-image: url(../../img/genre-asultrifle.jpg);
}
.arms-genre-img-2{
    background-image: url(../../img/genre-sniperrifle.jpg);
}
.arms-genre-img-3{
    background-image: url(../../img/genre-machinegun.jpeg);
}
.arms-genre-img-4{
    background-image: url(../../img/genre-handgun.jpg);
}
.arms-genre-img-5{
    background-image: url(../../img/genre-custom.jpg);
}
.arms-genre-img-6{
    background-image: url(../../img/genre-custom-inner.avif);
}
.arms-genre-img-7{
    background-image: url(../../img/genre-wear.jpg);
}
.arms-genre-img-8{
    background-image: url(../../img/genre-supply.jpg);
}
.arms-genre-label{
    font-size: 12px;
    white-space: nowrap;
    line-height: 50px;
}


/* For Large Devices */
@media screen and (min-width: 768px) {
    .navbar-nav{
        margin: auto;
    }
    .map-contents{
        height: 420px;
        width: 600px;
    }
    .map-contents>.btn{
        background-color: rgba(255,255,255,0.8);
        padding: 0.25rem 1.0rem;
        font-size: 14px;
        line-height: 16px;
    }
    .map-contents>.btn-hokkaido{
        top: 38px;
        left: 485px;
    }
    .map-contents>.btn-tohoku{
        top: 149px;
        left: 481px;
    }
    .map-contents>.btn-kitakanto{
        top: 219px;
        left: 456px;
    }
    .map-contents>.btn-minamikanto{
        top: 276px;
        left: 475px;
    }
    .map-contents>.btn-koshinetsu{
        top: 154px;
        left: 415px;
        padding: 0.25rem 0.25rem;
    }
    .map-contents>.btn-hokuriku{
        top: 204px;
        left: 333px;
    }
    .map-contents>.btn-tokai{
        border: 1.5px solid #C9A500;
        top: 290px;
        left: 360px;
    }
    .map-contents>.btn-kinki{
        border: 1.5px solid #FF9900;
        top: 262px;
        left: 276px;
    }
    .map-contents>.btn-chugoku{
        border: 1.5px solid #FA6120;
        top: 262px;
        left: 164px;
    }
    .map-contents>.btn-shikoku{
        border: 1.5px solid #DD4E68;
        top: 328px;
        left: 162px;
    }
    .map-contents>.btn-kyushu{
        border: 1.5px solid #B548D0;
        top: 292px;
        left: 40px;
        padding: 0.25rem 0.5rem;
    }
    .arms-genre-card{
        height: 100px;
    }
    .arms-genre-label{
        font-size: 18px;
        line-height: 100px;
    }
}

/* For Desktop */
@media screen and (min-width: 1000px) {
    .navbar {
        padding: 0;
        font-size: 14px;
    }
}