@charset "utf-8";

.index .ex {
    padding: 43px 0 35px;
    background-color: #E3E3E3;
    text-align: center;
    font-size: 16px;
    letter-spacing: 0.1em;
    line-height: 1.5;
}

.index .ex-note {
    color: #999;
    margin-bottom: 30px;
    margin-right: auto;
    margin-left: auto;
    width: 1000px;
}

@media only screen and (max-width: 599px) {
    .index .ex {
        padding: 40px 10px 35px;
    }

    .index .ex-note {
    }
}

.index .bnrArea {
    overflow: hidden;
    width: 1000px;
    margin: 0 auto;
}


.index .bnrArea .block {
    float: left;
    width: 480px;
}

.index .bnrArea .block:last-child:not(:only-child) {
    float: right;
}

.line {
    padding-top: 30px;
}

.bttxt {
    padding-top: 20px;
}

.bttxt .txtA {
    font-size: 14px;
    line-height: 1.8;
}

.bttxt .h {
    margin-bottom: 15px;
    font-size: 18px;
    text-align: center;
}

/*
.index .bnrArea .block:last-child img:first-child {
	margin:0 0 40px 0;
}

.index .bnrArea a:hover img {
	opacity: 0.8;
}
*/
.p-topics__header {
    border-bottom: none;
    background-color: #f0f2f3;
    padding-top: 60px;
    padding-bottom: 60px;
    margin: 0 0 30px;
    text-align: center;
    display: block;
}

.p-topics__header img {
    max-width: 90%;
    width: auto;
    height: auto;
    vertical-align: bottom;
}

.fb-page {
    margin: 0 0 0 100px;
}

#fNav {
    margin-top: 30px;
}

/* bg */
.bg,
.bg img {
    width: 100%;
    z-index: 10;
    position: relative;
}

.column2 #mainContent {
    float: none;
    margin: 0 auto;
}

.pageNav {
    margin-bottom: 50px;
}

.pageNav ul {
    margin: 0 auto;
    text-align: center;
}

.pageNav li {
    display: inline-block;
    margin: 0;
    padding: 0;
    text-align: left;
    line-height: 21px;
}

.pageNav a,
.pageNav span {
    display: inline-block;
    padding: 3px 30px 3px 35px;
    line-height: 21px;
    color: #0060b0;
    background: url(../../../common/imgs/bg-anc.gif) no-repeat 0 50%;
}

.pageNav span {
    color: #999;
}

.pageNav a:hover {
    color: #0060b0;
    background: url(../../../common/imgs/bg-anc_ov.gif) no-repeat 0 50%;
}

.btn {
    text-align: right;
}

.r-box {
    float: right;
}

.l-box {
    float: left;
}

.historyList.l-box {
    width: 360px;
}

.historyList span {
    display: block;
    color: #428fc7;
    font-size: 14px;
    font-weight: bold;
}

.historyList li {
    margin-top: 15px;
}

.historyList li:first-child {
    margin-top: 0;
}

#fbArea {
    margin-top: 30px;
    text-align: center;
}

div.fb-like-box, div.fb-like-box iframe[style], div.fb-like-box span {
    text-align: center;
    width: 100% !important;
}

#hNav li a span,
#nav li a span,
#hNav li.ON span,
#nav li.ON span {
    display: none;
}

#spNav {
    display: none;
    cursor: pointer;
}

#footer #left ul li:first-child {
    margin-bottom: 10px;
}

#slider02 {
    display: none;
}

.next40Bnr .sp {
    display: none;
}

.blue {
    color: #428fc7;
    font-size: 14px;
    font-weight: bold;
}

.teamList {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
}

.teamList li {
    /*display: inline-block;*/
    display: block;
    margin-bottom: 20px;
    width: calc((100% - 20px) / 2);
}

.teamList li.even {
    margin-left: 20px;
}

.teamName {
    font-weight: bold;
}

@media only screen and (max-width: 599px) {
    img {
        max-width: 100%;
    }

    body.base {
        min-width: inherit;
    }

    h1 img {
        width: 130px;
        height: 41px;
    }

    #spNav {
        display: block;
        padding: 10px;
        text-align: right;
        position: absolute;
        right: 0;
        top: 20px;
        z-index: 1000;;
    }

    .base .wrap {
        width: auto;
        padding-left: 10px;
        padding-right: 10px;
    }

    .btn {
        text-align: center;
    }

    #header {
        border-top: #005FAF solid 2px;
    }

    #header .wrap {
        padding: 0;
    }

    #header h1 {
        float: none;
        margin-left: 10px;
    }

    #hNav li a span, #nav li a span, #hNav li.ON span, #nav li.ON span {
        display: block;
    }

    #hNav li a img, #nav li a img, #hNav li.ON img, #nav li.ON img {
        display: none;
    }

    #hNav li, #nav li {
        float: none;
    }

    #fontSize {
        display: none;
    }

    #nav {
        float: none;
        padding-top: 0px;
    }

    #hNav li {
        position: relative;
        top: 0;
    }

    #hNav li.bt00, #hNav li.bt01, #hNav li.bt02, #hNav li.bt03, #hNav li.bt04 {
        right: 0px;
    }

    .base #container {
        width: auto;
    }

    .base #container.column2 #mainContent, .base #container.column2 .wrap {
        width: auto;
        padding-top: 5%;
        padding-left: 10px;
        padding-right: 10px;
    }

    .next40Bnr {
        padding-right: 10px;
        padding-left: 10px;
    }

    .next40Bnr .pc {
        display: none;
    }

    .next40Bnr .sp {
        display: block;
    }

    .next40Bnr img {
        max-width: 100%;
    }

    #top #imgArea {
        clear: both;
        height: auto;
    }

    #top #imgArea .wrap {
        height: auto;
    }

    #slider {
        display: none;
    }

    #slider02 {
        display: block;
        width: 100%;
        padding-bottom: 75%;
    }

    #slider02 li {
        width: 100%;
    }

    #slider02 img {
        max-width: 100%;
    }

    #slider #pageNav {
        display: none;
    }

    #hNav, #nav {
        position: absolute;
        width: 100%;
        display: none;
        -webkit-transition: all .25s ease-in-out;
        -moz-transition: all .25s ease-in-out;
        -ms-transition: all .25s ease-in-out;
        -o-transition: all .25s ease-in-out;
        transition: all .25s ease-in-out;
        z-index: 1000;
    }

    #hNav {
        top: 61px;
    }

    #nav {
        top: 276px;
    }

    #hNav.active, #nav.active {
        display: block;
    }

    #hNav li a, #hNav li.ON {
        display: block;
        padding: 10px 10px 10px 30px;
        color: #efefef;
        border-bottom: solid #efefef 1px;
        opacity: 0.9;
        background: #242424 url(/common/imgs/icn-nav-arrow_w.png) no-repeat 10px 50%;
        background-size: 9px auto;
    }

    #hNav li.ON {
        background-color: #666;
    }

    #hNav {
        margin-bottom: 2px;
    }

    /* #nav */
    #nav li {
        padding: 0;
    }

    #nav li a, #nav li.ON {
        display: block;
        background: #fff;
        color: #007FCC;
        border-bottom: solid #007FCC 3px;
        opacity: 0.9;
        padding: 10px 10px 10px 30px;
        background: #fff url(/common/imgs/icn-nav-arrow_b.png) no-repeat 10px 50%;
        background-size: 9px auto;
    }

    #nav li.ON {
        background: #fff url(/common/imgs/icn-nav-arrow_w.png) no-repeat 10px 50%;
        color: #fff;
        background-color: #007FCC;
        background-size: 9px auto;
    }

    /* list */
    #top #mainContent h3.title span {
        position: absolute;
        top: 25px;
        left: inherit;
        right: 0;
    }

    /* dl */
    dl.list {
        overflow-y: scroll;
        height: 200px;
        margin-bottom: 40px;
    }

    dl.list dt {
        clear: left;
        float: none;
        padding: 0;
        width: auto;
        font-weight: bold;
    }

    dl.list dd {
        position: relative;
        padding: 5px 0 15px;
        padding-left: 0;
        margin-bottom: 15px;
        border-bottom: 1px #ccc dotted;
    }

    dl.list dd br {
        display: none;
    }

    dl.list dd span {
        top: -18px;
    }

    dl.list dd .new {
        position: absolute;
        top: -16px;
        left: 185px;
    }

    /* pick up */
    .column2 #sideContent {
        float: none;
        width: auto;
    }

    #sideContent #pickup {
        width: auto;
        padding-left: 10px;
        padding-right: 10px;
    }

    #pickup ul {
        text-align: center;
    }

    #pickup li {
        display: inline-block;
        padding: 8px 0 7px;
    }

    #pickup li a {
        display: block;
        width: 220px;
        padding-top: 41px;
        text-indent: -9999px;
    }

    /* serviceBox */
    #top #serviceBox div.fl {
        width: auto;
        float: none;
    }

    #top #serviceBox ul li {
        float: none;
        margin-right: 0px;
        margin-bottom: 2px;
    }

    #top #serviceBox div.fr {
        width: auto;
        float: none;
        margin-top: 20px;
    }

    #top #serviceBox div.fr img {
        width: 100%;
    }

    #top #serviceBox div.fr li.clm02 img {
        width: 49%;
    }

    /* footer */
    #footer .wrap {
        padding: 30px 10px 20px;
    }

    #footer #pagetop {
        left: 50%;
        margin-left: -60px;
    }

    #footer #left, #footer #left.renew {
        float: none;
        width: auto;
    }

    #footer #left h5, #footer #left.renew h5 {
        width: auto;
        margin-bottom: 20px;
    }

    #footer #left {
        float: none;
        width: auto;
    }

    #footer #left h5 {
        width: auto;
        margin-bottom: 20px;
    }

    #footer #left {
        margin-bottom: 30px;
    }

    #footer #left ul {
        margin: 0;
        text-align: center;
    }

    #footer #left li {
        text-align: center;
    }

    #footer #right {
        float: none !important;
        clear: both;
        width: auto;
    }

    #footer #right h5 {
        margin-bottom: 20px;
        padding-top: 16px;
        font-size: 14px;
    }

    #footer #right .fl, #footer #right .fr {
        float: none !important;
    }

    #footer #right .fl {
        margin-bottom: 30px;
    }

    #footer #right .sbox {
        width: 300px;
        background: none;
        margin-left: auto;
        margin-right: auto;
    }

    #footer #right .sbox h6 {
        width: auto;
        height: 47px;
        text-indent: -99999px;
        overflow: hidden;
        background-size: 300px;
    }

    #footer #right .sbox ul {
        padding: 10px 5px;
    }

    #footer #right .sbox li {
        padding: 8px 0;
    }

    #footer #right .sbox a {
        padding-left: 25px;
        color: #fff;
        font-size: 13px;
        text-decoration: underline;
    }

    #footer #copyright ul {
        float: none;
        text-align: center;
    }

    #footer #copyright li {
        float: none;
        display: inline-block;
    }

    #footer #copyright p {
        margin-top: 20px;
        float: none;
        line-height: 20px;
        text-align: center;
    }


    /* common */
    .column2 #sideContent {
        float: none;
        margin-top: 60px
    }

    .column2 #mainContent {
        float: none;
    }

    .column2 #sideContent #sNav {
        margin-left: 10px;
        margin-right: 10px;
    }

    #mainContent h2.title {
        padding-top: 55px;
    }

    #mainContent h2.title span {
        top: 15px;
        right: auto;
        left: 0;
    }

    /* jrcup */
    #bcl {
        display: none;
    }

    .r-box, .l-box {
        float: none;
    }

    .num01 .r-box {
        margin-top: 20px;
        text-align: center;
    }

    .historyList.l-box {
        width: auto;
        margin-bottom: 20px;
    }

    .historyBox .r-box {
        text-align: center;
    }

    #fbArea {
        margin-top: 30px;
        padding: 0px;
        border: none;
        background-color: #fff;
        text-align: center;
    }

    div.fb-like-box, div.fb-like-box iframe[style], div.fb-like-box span {
        text-align: center;
        width: 100% !important;
    }

    .pageNav a, .pageNav span {
        padding: 3px 15px 3px 30px;
    }

    .pageNav li:last-child a, .pageNav li:last-child span {
        padding: 3px 0px 3px 30px;
    }

    .teamList {
    }

    .teamList li {
        text-align: center;
        display: block;
        margin-bottom: 20px;
    }

    .teamList li.even {
        margin-left: 0px;
    }

    .teamList li img {
        max-width: 100%;
    }


    .index .ex {
        width: 90%;
        text-align: center;
        font-size: 12px;
        margin: 10% auto 0 auto;
        line-height: 1.8;
    }

    .index .ex-note {
        margin: 0 auto 10% auto;
        width: 90%;
        line-height: 1.5;
    }

    .index .bnrArea {
        width: 90%;
        margin: 0 auto;
    }

    .index .bnrArea img {
        width: 100%;
        /*
            margin: 0 0 4% 0;
        */
    }

    .index .bnrArea .block {
        width: 100%;
        float: none;
        padding-bottom: 40px;
    }

    .index .bnrArea .block:last-child {
        float: none;
    }

    /*
    .index .bnrArea .block:last-child img:first-child {
        margin:0 0 8% 0;
    }

    .index .bnrArea a:hover img {
        opacity: 0.8;
    }
    */
    .index .bttxt .txtA {
        font-size: 12px;
        line-height: 1.8;
    }

    .index .bttxt .h {
        font-size: 16px;
    }

    .sp .s7 p.abText {
        width: 90%;
        position: absolute;
        top: 50%;
        left: 5%;
    }


    /* page */
    .page {
        padding-top: 64px !important;
    }

    /* facebook */
    .facebook-wrapper {
        max-width: 500px;
        margin: 0 auto 20px auto;
    }

    .facebook-wrapper > .fb-page {
        width: 100%;
    }

    .facebook-wrapper > .fb-page > span,
    .facebook-wrapper iframe {
        width: 100% !important;
    }

    .fb-page {
        margin: 0 0 0 0;
    }

}

.clmBox {
    overflow: hidden;
}

.clmBox > div {
    float: left;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.clmBox.clmn2 {
    /*
            margin-top: -20px;
            margin-left: -2%;
    */
}

.clmBox.clmn2 > div {
    width: 50%;
    margin-top: 20px;
    /*
            margin-left: 2%;
    */
}

.clmBox > div.cl {
    clear: left;
}

@media only screen and (max-width: 640px) {
    .clmBox.clm2 {
        margin-left: 0;
    }

    .clmBox.clm2 > div {
        float: none;
        width: auto;
        margin-left: 0;
    }


    .clmBox > div .ac img {
        width: 100%;
    }

    .clmBox > div.cl {
        clear: none;
    }

    .clmBox > div.clsp {
        clear: left;
    }
}


.sp-holizontal-scroller{
    position: relative;
}
@media only screen and (max-width: 599px) {
    .sp-holizontal-scroller{
        overflow-x: auto;
    }
}