@charset "UTF-8";

/*
/* common設定
/* -------------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6 { margin-top: initial; margin-bottom: initial; font-size: initial; font-weight: initial; }

.section_feature .main,
.section_info h2,
.section_about h2{
    position: relative;
    display: inline-block;
    margin-bottom: 1em;
    font-size: 2.75em;
    font-weight: bold;
  }
.section_feature .main::before,
.section_info h2:before,
.section_about h2:before {
    content: '';
    position: absolute;
    bottom: -15px;
    display: inline-block;
    width: 80px;
    height: 4px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #fff000;
    border-radius: 2px;
  }

  @media screen and (max-width: 699px) {
    .section_feature .main,
    .section_info h2,
    .section_about h2{
    margin-bottom: 1em;
    font-size: 1.75em;
  }
}

/*
/* section_mv
/* -------------------------------------------------- */

.section_mv{
    background: url(/contents/other/shop/img/service/mouse_refurbished_pc/mv.jpg) #ffffff;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
}

@media screen and (max-width: 699px) {
}

/*
/* section_nav
/* -------------------------------------------------- */

.section_nav{
    background-color: #201F86;
}
.section_nav li a{
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    background-color: #201F86;
    transition: 0.3s all ease;
    padding: 1.5em 0;
    display: block;
}
.section_nav li a:hover{
    color: #000;
    background-color: #fff000;
}
@media screen and (max-width: 699px) {
    .section_nav li a{
        padding: 0.8em 0;
        border-top: 1px solid #fff;
    }
}

/*
/* section_about
/* -------------------------------------------------- */

.section_about h3 {
    display: inline;
	background-image: linear-gradient(rgba(0,0,0,0) 70%, rgb(255,240,0) 70%);
    font-weight: bold;
}
.section_about .block_border{
    border: 2px solid #201F86;
}
.section_about .list_m{
    background-color: #201F86;
    border-radius: 17px 0 0 17px;
}

@media screen and (max-width: 699px) {
    .section_about .list_m{
        border-radius: 17px 17px 0 0;
    }
}

/*
/* section_feature
/* -------------------------------------------------- */

.section_feature{
    background-color: #FFFFD7;
}

.section_feature .feature_box{
    border: 2px solid #201F86;
    background-color: #fff;
    position: relative;
}
.section_feature .feature_box h2{
    position: absolute;
    background-color: #fff000;
    display: inline-block;
    border-radius: 50px;
    font-size: 1.8em;
    top: -1em;
    left: 50%;
    transform: translateX(-50%);
    padding: 0.1em 1em 0 0;
    font-weight: bold;
}
.section_feature .feature_box h2 span{
    background-color: #201F86;
    border-radius: 50px;
    color: #fff;
    padding: 0.22em 0.6em;
    margin-right: 0.5em;
}
.section_feature .block_border{
    border: 2px solid #303030;
}
.section_feature .list_m{
    background-color: #303030;
    border-radius: 17px 0 0 17px;
}

.section_feature .attension{
    border-radius: 20px 20px 0 0;
}
.section_feature .attension_block{
    border-radius:0 0 20px 20px;
}
.section_feature .attension_block li:not(:first-child){
    margin-top: 0.3em;
}
.section_feature .parent {
    height: 137px;
}

.section_feature .listit{
    line-height: 7em;
}

@media screen and (max-width: 699px) {
    .section_feature .feature_box h2{
        font-size: 1.2em;
        padding: 0.1em 0.1em 0 0;
    }
    .section_feature .parent {
        height: auto; 
      }
      .section_feature .list_m{
        border-radius: 17px 17px 0 0 ;
    }
    .section_feature .listit{
        line-height: 2em;
    }
}

/*
/* section_info
/* -------------------------------------------------- */

.section_info{
    position: relative;
}
.section_info::after {
    content: "";
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 20px 15px 0 15px;
    border-style: solid;
    border-color: #ffffff transparent transparent transparent;
    z-index: 1;
}

@media screen and (max-width: 699px) {
}


/*
/* section_shop
/* -------------------------------------------------- */

.section_shop h2{
    position: relative;
    display: inline-block;
    margin-bottom: 1em;
    font-size: 2.75em;
    font-weight: bold;
  }
.section_shop h2:before {
    content: '';
    position: absolute;
    bottom: -15px;
    display: inline-block;
    width: 80px;
    height: 4px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #fff;
    border-radius: 2px;
  }

.section_shop ._button a{
    text-decoration: none;
    padding: 0.5em 1em;
    background-color: #fff;
    color: #000;
    border-radius: 100vh;
    font-weight: bold;
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
    transition: all 0.3s
}
.section_shop ._button a:hover{
    background-color: #201F86;
    color: #fff;
}

.section_shop .shopbox{
    border-radius: 20px;
    min-height: 170px;
    background: #FFFFCE;
    transition: .2s ease all;
}
.section_shop .shopbox:hover{
    opacity: 0.8;
}
.section_shop .shop_list a:hover{
    text-decoration: none;
    color: initial;
}
.section_shop .shopbox .name{
    background: #201F86;
    border-radius: 20px 20px 0 0;
    color: #fff;
    text-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3);
}
.section_shop .shopbox .data{
    border-radius:0 0 20px 20px;
    color: #000000;
}
.section_shop .shopbox .data dl{
    display: flex; 
    flex-wrap: wrap;
}
.section_shop .shopbox  dt{
    width: 20%;
    font-weight: bold;
}
.section_shop .shopbox  dd {
    width: 80%;
}
.section_shop .shop_no {
    font-size: 2.5em;
    display: inline;
	background-image: linear-gradient(rgba(255, 255, 255, 0) 70%, rgb(255, 252, 206) 70%);
    font-weight: bold;
}

@media screen and (max-width: 699px) {
    .section_shop h2{
        font-size: 1.75em;
      }
    .section_shop ._button a{
        padding: 0.5em;
    }
    .section_shop .shopbox{
        height: auto;
    }
    .section_shop .shop_no {
        font-size: 1.5em;
    }
}