/* Site settings */
// フォントファミリー
$font: 'Open Sans', "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
$font-ms: 'Open Sans', "メイリオ", Meiryo, "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
$enfont:"Orelega One", serif; //400
$enfont2:"Oswald", sans-serif; //200-700
$jpfont:"Noto Sans JP", sans-serif; //100-900
// フォントカラー
$base-color: #393939;
$second-color: #0062b1;
// ブレイクポイント
$newbreak-pc: 999px;
$newbreak-tb: 768px;
$newbreak-sp: 540px;
//フォントスタイル
@mixin font-style($f-size, $f-weight:400, $f-letter:0, $f-height:1) {
    font-size: $f-size;
    font-weight: $f-weight;
    letter-spacing: $f-letter;
    line-height: $f-height;
  }
//ラッパー
@mixin wrap($wrap-width) {
    box-sizing: border-box;
    padding: 0 20px;
    max-width: calc(#{$wrap-width} + 40px);
    margin: 0 auto;
    @media screen and (max-width:540px) {
        padding: 0 10px;
    }
}
@mixin centerall {
    display:flex;
    justify-content:center;
    align-items:center;
  }
/*-----------------------------
トップ
----------------------------*/
.toppage2025 {
    > section {
        margin-top:0 !important;
    }
    img {
        width:100%;
        height:auto;
    }
    .sec_ttl {
        font-family:$enfont;
        @include font-style(40px,400,2px,1);
        color:$second-color;
        margin-bottom:25px;
        @media screen and (max-width:$newbreak-sp) {
            @include font-style(30px,400,1px,1);
            margin-bottom:15px;
        }
        &.wh {
            color:#fff;
        }
    }
    .ttlbox1 {
        position:relative;
        a {
            position:absolute;
            top:3px;
            left:230px;
            width:200px;
            height:32px;
            border-radius: 16px;
            @include centerall;
            font-family:$jpfont;
            @include font-style(16px,700,0,1);
            border:1px solid $second-color;
            @media screen and (max-width:$newbreak-tb) {
                left:auto !important;
                right:0 !important;
                top:0;
                @include font-style(14px,700,0,1);
                width:145px;
            }
            &:before {
                content:"";
                display:inline-block;
                width: 0;
                height: 0;
                border-style: solid;
                border-top: 7px solid transparent;
                border-bottom: 7px solid transparent;
                border-left: 12px solid #0062b1;
                border-right: 0;
                margin-right:15px;
                @media screen and (max-width:$newbreak-tb) {
                    border-top: 5px solid transparent;
                    border-bottom: 5px solid transparent;
                    border-left: 8px solid #0062b1;
                    margin-right:5px;
                }
            }
            &:nth-of-type(1) {
                color:$second-color;
                background:#fff;
                margin-right:15px;
                @media screen and (max-width:$newbreak-tb) {
                    margin-right:5px;
                }
            }
        }
    }
    .lead_txt {
        @include font-style(16px,400,0,1.5);
    }
    .wrap {
        @include wrap(1000px);
    }
}

#heros {
    overflow:hidden;
    .swiper-slide {
        a {
            display:block;
        }
        picture {
            display:block;
            width:100%;
        }
        img {
            width:100%;
            height:auto;
        }
    }
    .swiper-pagination-hero {
        text-align:center;
        width:auto;
        height:4px;
        margin:15px auto 20px;
        display:block;
        @media screen and (max-width:$newbreak-sp) {
            margin:10px auto 15px;
        }
    }
    .swiper-button-next-hero {
        right:20px;
        @media screen and (max-width:$newbreak-sp) {
            right:10px;
        }
    }
    .swiper-button-prev-hero {
        left:20px;
        @media screen and (max-width:$newbreak-sp) {
            left:10px;
        }
    }
}

/*検索エリア*/
#searcharea {
    background:url(../img/toppage2025/bg1.webp);
    background-size:cover;
    background-position:center;
    padding:40px 0;
    .wrap {
        .logo {
            width:330px;
            margin:0 auto;
            @media screen and (max-width:$newbreak-sp) {
                width:260px;
            }
        }
        .logo+p {
            width:520px;
            margin:35px auto 40px;
            @include font-style(16px,700,0,1);
            color:#fff;
            display: flex;
            align-items: center;
            @media screen and (max-width:$newbreak-sp) {
                width:100%;
                margin:20px auto 30px;
                font-size:15px;
            }
            &:before, &:after {
                content: "";
                height: 1px;
                background-color: #fff;
                flex-grow: 1;
            }
            &:before {
                margin-right: 15px;
                @media screen and (max-width:$newbreak-sp) {
                    margin-right: 10px;
                }
            }
            &:after {
                margin-left: 15px;
                @media screen and (max-width:$newbreak-sp) {
                    margin-left: 10px;
                }
            }
        }
        .search_field {
            width:520px;
            padding:0 0 0 25px;
            margin:0 auto;
            box-sizing:border-box;
            @media screen and (max-width:$newbreak-sp) {
                width:100%;
                padding:0;
            }
            .field_wrap {
                display:flex;
                align-items: center;
                p {
                    @include font-style(14px,700,0,1);
                    color:#fff;
                    font-family: $jpfont;
                    width:95px;
                    @media screen and (max-width:$newbreak-sp) {
                        width:90px;
                    }
                }
                &.keywordselect {
                    margin-bottom:20px;
                    input[type=text]  {
                        -webkit-appearance: none;
                        appearance: none;
                        border-radius:6px;
                        border:none;
                        padding:5px 10px;
                        height:35px;
                        width:280px;
                        @include font-style(16px,700,0,1);
                        font-family: $font;
                        @media screen and (max-width:$newbreak-sp) {
                            font-size:15px;
                            flex:1;
                        }
                        &::placeholder {
                            @include font-style(14px,500,0,1);
                            font-family: $font;
                            color:#666;
                        }
                    }
                }
                &.areaselect {
                    position:relative;
                    select {
                        -webkit-appearance: none;
                        appearance: none;
                        border-radius:6px;
                        border:none;
                        width:184px;
                        padding:5px 10px;
                        height:35px;
                        @include font-style(16px,500,0,1);
                        font-family: $font;
                        @media screen and (max-width:$newbreak-sp) {
                            font-size:15px;
                        }
                    }
                    &:after {
                        content:"";
                        display:block;
                        border-bottom: solid 1.5px #000;
                        border-right: solid 1.5px #000;
                        width: 6px;
                        height: 6px;
                        transform: rotate(45deg);
                        position:relative;
                        top:-2px;
                        left:-22px;
                    }
                }
            }
            button {
                padding: 0;
                border: none;
                outline: none;
                font: inherit;
                color: inherit;
                background: none;
                width:256px;
                height:40px;
                border-radius: 20px;
                @include centerall;
                @include font-style(18px,700,2px,1);
                color:#fff;
                font-family:$jpfont;
                border:1px solid #fff;
                margin:30px auto 0;
                cursor: pointer;
                transition:all .3s;
                @media screen and (max-width:$newbreak-sp) {
                    font-size:16px;
                    transition:unset;
                }
                &:hover {
                    color:$second-color;
                    background:#fff;
                    @media screen and (max-width:$newbreak-sp) {
                        color:#fff;
                        background:transparent;
                    }
                }
            }
        }
    }
}

/*単一バナー*/
.bnrset {
    @include wrap(672px);
    margin-top:50px;
    @media screen and (max-width:$newbreak-sp) {
        margin-top:30px;
    }
    a {
        display:block;
    }
    &.bnrset2 {
        max-width:1040px;
        display:flex;
        justify-content: center;
        @media screen and (max-width:$newbreak-sp) {
            flex-direction:column;
        }
        a {
            &:nth-of-type(1) {
                margin-right:20px;
                @media screen and (max-width:$newbreak-sp) {
                    margin:0 auto 10px;
                }
            }
        }
    }
    &.bnrset3 {
        max-width:1040px;
        display:flex;
        justify-content: center;
        @media screen and (max-width:$newbreak-tb) {
            flex-direction:column;
        }
        a {
            &:nth-of-type(1),
            &:nth-of-type(2) {
                margin-right:10px;
                @media screen and (max-width:$newbreak-tb) {
                    margin:0 auto 10px;
                }
            }
        }
    }
}

/*NEWS&TOTAL*/
#news {
    padding:55px 0 45px;
    @media screen and (max-width:$newbreak-sp) {
        padding:30px 0;
    }
    /*ニュース*/
    #news-status {
        margin-bottom: 30px;
        #news-box {
            div {
                &.slide-arrow {
                    position: absolute;
                    z-index: 3;
                    cursor: pointer;
                }
                &.prev-arrow {
                    top: 0;
                    right: 15px;
                    width: 0;
                    height: 0;
                    transition:all 0.3s;
                    &:before {
                        content: "";
                        width: 0;
                        height: 0;
                        border-style: solid;
                        border-right: 6px solid transparent;
                        border-left: 6px solid transparent;
                        border-bottom: 10px solid #b3b3b3;
                        border-top: 0;
                        position: absolute;
                        top: 50%;
                        left: 0;
                    }
                }
                &.next-arrow {
                    bottom: 11px;
                    right: 15px;
                    width: 0;
                    height: 0;
                    transition:all 0.3s;
                    &:before {
                        content: "";
                        width: 0;
                        height: 0;
                        border-style: solid;
                        border-right: 6px solid transparent;
                        border-left: 6px solid transparent;
                        border-top: 10px solid #b3b3b3;
                        border-bottom: 0;
                        position: absolute;
                        top: 50%;
                        left: 0;
                    }
                }
            }
            .nw-holder {
                border-top:1px solid #d7d7d7;
                border-bottom:1px solid #d7d7d7;
                padding:10px 0;
                @media screen and (max-width:$newbreak-sp) {

                }
                ul {
                    overflow: hidden;
                    li {
                        height: 50px;
                        padding: 0 30px 0 0;
                        display: flex;
                        justify-content: center;
                        @media screen and (max-width:$newbreak-tb) {
                            flex-direction: column;
                            height: auto;
                            min-height:120px;
                        }
                        @media screen and (max-width:$newbreak-sp) {
                            padding: 0 20px 0 0;
                        }
                        p {
                            &.dates {
                                width:130px;
                                font-family:$enfont;
                                @include font-style(20px,400,1px,1.4);
                                color:$second-color;
                                @media screen and (max-width:$newbreak-pc) {
                                    font-size:18px;
                                }
                                @media screen and (max-width:$newbreak-tb) {
                                    width:100%;
                                }
                            }
                            &.news-ttl {
                                flex:1;
                                font-family:$font;
                                @include font-style(16px,500,1px,1.7);
                                @media screen and (max-width:$newbreak-sp) {
                                    font-size:14px;
                                }
                            }
                        }
                        a {
                            color: $second-color;
                        }
                    }
                }
            }
        }
    }
    /*総数*/
    .box {
        display:flex;
        @media screen and (max-width:$newbreak-sp) {
            flex-direction: column;
        }
        section {
            width:50%;
            display:flex;
            flex-direction: column;
            align-items: center;
            @media screen and (max-width:$newbreak-sp) {
                width:100%;
            }
            h3 {
                font-family:$jpfont;
                @include font-style(18px,700,3px,1.4);
                color:#808080;
                text-align: center;
                margin-bottom:10px;
                @media screen and (max-width:$newbreak-sp) {
                    @include font-style(16px,700,2px,1.4);
                }
                /*
                &:after {
                    content:"";
                    display:block;
                    border-bottom: solid 3px #e6e6e6;
                    border-right: solid 3px #e6e6e6;
                    width: 7px;
                    height: 7px;
                    transform: rotate(45deg);
                    margin:15px auto 10px;
                    @media screen and (max-width:$newbreak-sp) {
                        margin:5px auto 15px;
                    }
                }*/
            }
            &#total_garbage {
                @media screen and (max-width:$newbreak-sp) {
                    margin-bottom:30px;
                }
                h3 {
                    margin-bottom:15px;
                }
                ul {
                    li {
                        display:flex;
                        align-items: center;
                        justify-content: space-between;
                        &:nth-of-type(1) {
                            margin-bottom:5px;
                        }
                        .kanen, .funen {
                            width:96px;
                            height:24px;
                            border-radius: 12px;
                            @include centerall;
                            color:#fff;
                            font-family:$jpfont;
                            @include font-style(14px,700,0,1);
                            margin-right:15px;
                        }
                        .kanen {background:$second-color;}
                        .funen {background:#2fb6f2;}
                        .volume {
                            display:inline-block;
                            span:nth-of-type(1) {
                                font-family:$enfont2;
                                @include font-style(40px,700,1px,1);
                            }
                            span:nth-of-type(2) {
                                font-family:$jpfont;
                                @include font-style(16px,700,0,1);
                                padding-left:5px;
                            }
                        }
                    }
                }
                /*
                .glaph {
                    width:100%;
                    max-width:424px;
                    height:16px;
                    margin:20px auto 0;
                    display:flex;
                    @media screen and (max-width:$newbreak-sp) {
                        margin:15px auto 0;
                    }
                    span:nth-of-type(1) {
                        width:67%;
                        background:$second-color;
                        border-radius: 8px 0 0 8px;
                    }
                    span:nth-of-type(2) {
                        width:33%;
                        background:#2fb6f2;
                        border-radius: 0 8px 8px 0;
                    }
                }*/
            }
            &#total_people {
                .volume {
                    span:nth-of-type(1) {
                        font-family:$enfont2;
                        @include font-style(64px,700,1px,1);
                        @media screen and (max-width:$newbreak-tb) {
                            font-size:50px;
                        }
                        @media screen and (max-width:$newbreak-sp) {
                            font-size:44px;
                        }
                    }
                    span:nth-of-type(2) {
                        font-family:$jpfont;
                        @include font-style(16px,700,0,1);
                        padding-left:5px;
                    }
                }
                .latest-dates {
                    @include font-style(14px,500,0,1);
                    margin-top:15px;
                    @media screen and (max-width:$newbreak-sp) {
                        margin-top:10px;
                    }
                }
            }
        }
    }
}
/*SPONSORS*/
#sponsors {
    padding:50px 0 35px;
    background:url(../img/toppage2025/bg_dot.webp);
    background-size:48px 48px;
    @media screen and (max-width:$newbreak-sp) {
        padding:30px 0 20px;
    }
    .sec_ttl br {
        display:none;
        @media screen and (max-width:$newbreak-pc) {
            display:block;
        }
    }
    .ttlbox1 {
        a {
            left:485px;
            @media screen and (max-width:$newbreak-pc) {
                left:285px;
            }
        }
    }
    .lead_txt {
        color:#fff;
    }
    .wrap {
        ul {
            display:flex;
            flex-wrap:wrap;
            margin-top:30px;
            @media screen and (max-width:$newbreak-sp) {
                margin-top:20px;
            }
            li {
                box-sizing: border-box;
                background:#fff;
                padding:15px;
                width:23.8%;
                margin-right:1.6%;
                margin-bottom:15px;
                &:nth-of-type(4n) {margin-right:0;}
                @media screen and (max-width:$newbreak-tb) {
                    width:48.5%;
                    margin-right:3%;
                    &:nth-of-type(4n) {margin-right:3%;}
                    &:nth-of-type(even) {margin-right:0;}
                }
                a {
                    display:flex;
                    flex-direction: column;
                    box-sizing: border-box;
                }
                h3 {
                    order:2;
                    max-width:170px;
                    margin:10px auto 0;
                }
                p {
                    order:3;
                    @include font-style(14px,500,0,1.5);
                    color:$base-color;
                }
                .image {
                    order:1;
                    overflow:hidden;
                    aspect-ratio: 51 / 29;
                    img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                }
            }
        }
    }
}
/*BLOG*/
#blog {
    padding:60px 0;
    @media screen and (max-width:$newbreak-sp) {
        padding:30px 0 60px;
    }
    .ttlbox1 {
        a {
            left:135px;
        }
    }
    ul {
        padding-top:15px;
        display:flex;
        li {
            box-sizing: border-box;
            padding:0 23px;
            width:calc((100% - 3px) / 4);
            border-right:1px solid $second-color;
            &:nth-of-type(4n) {border:none;}
            @media screen and (max-width:$newbreak-tb) {
                border:none;
                padding:0;
            }
            &.swiper-slide {
                height:auto;
            }
            a {
                display:block;
            }
            article {
                display:flex;
                flex-direction: column;
                box-sizing: border-box;
                h3 {
                    order:3;
                    @include font-style(16px,700,0,1.3);
                    font-family: $jpfont;
                    color:$second-color;
                    @media screen and (max-width:$newbreak-tb) {
                        font-size:14px;
                    }
                }
                p {
                    order:2;
                    @include font-style(16px,400,1px,1);
                    font-family: $enfont;
                    color:#999;
                    text-align:center;
                    margin:15px 0;
                    @media screen and (max-width:$newbreak-tb) {
                        font-size:14px;
                        margin:10px 0;
                    }
                }
                .image {
                    order:1;
                    overflow:hidden;
                    //aspect-ratio: 429 / 467;
                    aspect-ratio: 51 / 29;
                    img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                }
            }
        }
    }
}
/*-----------
swiper
------------*/
.swwrap {
    position:relative;
}
.swiper-pagination-hero,
.swiper-pagination-blog,
.swiper-pagination-events,
.swiper-pagination-reports {
    display:none;
    text-align:center;
    width:auto;
    height:4px;
    margin:15px auto 0;
    @media screen and (max-width:$newbreak-tb) {
        display:block;
    }
}
.swiper-pagination-bullet {
    transition:all .3s;
    vertical-align:top;
    opacity:1;
    background-color:#e6e6e6;
    border-radius:0;
    border:none;
    height:4px;
    width:40px;
    margin:0 auto;
}
.swiper-pagination-bullet-active {
    opacity:1;
    background-color:$second-color;
}
.swiper-button-prev-hero,
.swiper-button-next-hero,
.swiper-button-prev-blog,
.swiper-button-next-blog,
.swiper-button-prev-events,
.swiper-button-next-events,
.swiper-button-prev-reports,
.swiper-button-next-reports,
.swiper-button-prev-contents,
.swiper-button-next-contents {
    display:none;
    cursor:pointer;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:20px;
    height:71px;
    z-index:2;
    filter:drop-shadow(1px 1px 1px rgba(0,0,0,.2));
    &:after {
        display:none;
    }
    img {
        width:100%;
        height:auto;
    }
    @media screen and (max-width:$newbreak-tb) {
        display:block;
    }
    @media screen and (max-width:$newbreak-sp) {
        width:10px;
        height:35.5px;
    }
}
.swiper-button-prev-hero,
.swiper-button-next-hero,
.swiper-button-prev-contents,
.swiper-button-next-contents {
    display:block;
}
.swiper-button-next-hero,
.swiper-button-next-blog,
.swiper-button-next-events,
.swiper-button-next-reports {
    right:0;
}
.swiper-button-prev-hero,
.swiper-button-prev-blog,
.swiper-button-prev-events,
.swiper-button-prev-reports {
    left:0;
}
.swiper-button-next-contents {
    right:0;
}
.swiper-button-prev-contents {
    left:0;
}
/*----------------------------*/

/*EVENTS & REPORTS 共通*/
#events, #reports {
    .listbox {
        position:relative;
        .bg {
            margin: 0 calc(50% - 50vw);
            width: 100vw;
            position:absolute;
            top:60px;
            left:0;
        }
    }
    ul {
        display:flex;
        margin-top:30px;
        position:relative;
        z-index:2;
        li {
            background:#fff;
            border:1px solid #ccc;
            padding:15px;
            box-sizing: border-box;
            width:23.8%;
            margin-right:1.6%;
            margin-bottom:15px;
            &:nth-of-type(4n) {margin-right:0;}
            @media screen and (max-width:$newbreak-tb) {
                margin:0;
            }
            article {
                box-sizing: border-box;
                display:flex;
                flex-direction: column;
                .image {
                    order:1;
                    overflow:hidden;
                    aspect-ratio: 51 / 29;
                    img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                    }
                }
                h3 {
                    order:2;
                    @include font-style(16px,700,0,1.3);
                    font-family: $jpfont;
                    color:$second-color;
                    margin:15px 0;
                    @media screen and (max-width:$newbreak-tb) {
                        font-size:14px;
                    }
                }
                p {
                    display:flex;
                    &:before {
                        width:16px;
                    }
                    a, span {
                        flex:1;
                    }
                }
                .data {
                    order:3;
                    @include font-style(16px,700,0,1.3);
                    color:$second-color;
                    margin-top:8px;
                    &:before {
                        content:"";
                        background:url(../img/common2025/icon_schedule.svg);
                        background-size:cover;
                        display:inline-block;
                        width:16px;
                        height:16px;
                        margin-right:10px;
                    }
                }
                .time {
                    order:4;
                    @include font-style(14px,500,0,1.3);
                    margin-top:8px;
                    &:before {
                        content:"";
                        background:url(../img/common2025/icon_time.svg);
                        background-size:cover;
                        display:inline-block;
                        width:16px;
                        height:16px;
                        margin-right:10px;
                    }
                }
                .point {
                    order:5;
                    @include font-style(14px,500,0,1.3);
                    margin-top:8px;
                    &:before {
                        content:"";
                        background:url(../img/common2025/icon_pin.svg);
                        background-size:cover;
                        display:inline-block;
                        width:13px;
                        height:16px;
                        margin-right:10px;
                        margin-left:2px;
                    }
                }
                .crew {
                    order:6;
                    @include font-style(14px,700,0,1.3);
                    margin-top:8px;
                    &:before {
                        content:"";
                        background:url(../img/common2025/icon_crew.svg);
                        background-size:cover;
                        display:inline-block;
                        width:16px;
                        height:16px;
                        margin-right:10px;
                    }
                }
            }
        }
    }
}
/*EVENTS*/
#events {
    .ttlbox1 {
        a {
            left:190px;
        }
    }
}
/*REPORTS*/
#reports {
    padding:60px 0 70px;
    @media screen and (max-width:$newbreak-sp) {
        padding:50px 0 30px;
    }
    .ttlbox1 {
        a {
            left:215px;
        }
    }
}
/*CONTENTS*/
#contents {
    position:relative;
    padding:50px 0 70px;
    background:url(../img/toppage2025/bg_dot.webp);
    background-size:48px 48px;
    @media screen and (max-width:$newbreak-sp) {
        padding:30px 0 30px;
    }
    .controlbox {
        width:1160px;
        height:71px;
        position:absolute;
        top:50%;
        left:50%;
        transform:translateX(-50%);
        z-index:2;
        @media screen and (max-width:1200px) {
            width:calc(100% - 40px);
        }
    }
    .wrap {
        overflow: hidden;
        position:relative;
        padding:0;
        @media screen and (max-width:1060px) {
            padding:0 10px;
        }
        ul {
            display:flex;
            li {
                width:32%;
                margin-right:2%;
                &:nth-of-type(3n) {margin-right:0;}
                a {
                    .image {
                        width:100%;
                        display:block;
                        margin-bottom:36px;
                        @media screen and (max-width:$newbreak-sp) {
                            margin-bottom:26px;
                        }
                    }
                    .txt {
                        width:280px;
                        min-height:114px;
                        background:#fff;
                        border-radius: 15px;
                        padding:20px;
                        box-sizing: border-box;
                        margin:0 auto;
                        @include centerall;
                        position:relative;
                        @media screen and (max-width:$newbreak-sp) {
                            min-height:80px;
                            padding:10px;
                        }
                        &:before {
                            content:"";
                            display:block;
                            width: 0;
                            height: 0;
                            border-style: solid;
                            border-right: 9px solid transparent;
                            border-left: 9px solid transparent;
                            border-bottom: 25px solid #ffffff;
                            border-top: 0;
                            position:absolute;
                            top:-25px;
                            left:0; right:0;
                            margin:0 auto;
                            @media screen and (max-width:$newbreak-sp) {
                                border-right: 6px solid transparent;
                                border-left: 6px solid transparent;
                                border-bottom: 18px solid #ffffff;
                                top:-18px;
                            }
                        }
                        p {
                            @include font-style(18px,700,0,1.38);
                            font-family: $jpfont;
                            color:$second-color;
                            text-align: center;
                            @media screen and (max-width:$newbreak-sp) {
                                @include font-style(15px,700,0,1.38);
                            }
                        }
                    }
                }
            }
        }
    }
}
/*MEMBERS*/
#members {
    padding:55px 0 30px;
    @media screen and (max-width:$newbreak-sp) {
        padding:30px 0 10px;
    }
    .wrap {
        max-width:1070px;
        padding:0 20px 0 0;
        transform:translateX(35px);
        @media screen and (max-width:1100px) {
            padding:0 20px;
            transform:translateX(0);
        }
        @media screen and (max-width:540px) {
            padding: 0 10px;
        }
    }
    .ttlbox {
        position:relative;
        .btnholder {
            display:flex;
            width:calc(144px*2 + 15px);
            height:32px;
            position:absolute;
            top:3px;
            left:230px;
            @media screen and (max-width:$newbreak-tb) {
                position:static;
                width:100%;
                top:0;
                left:auto;
                margin-bottom:20px;
            }
            a {
                width:144px;
                height:32px;
                border-radius: 16px;
                @include centerall;
                font-family:$jpfont;
                @include font-style(16px,700,0,1);
                border:1px solid $second-color;
                @media screen and (max-width:$newbreak-tb) {
                    @include font-style(14px,700,0,1);
                }
                &:before {
                    content:"";
                    display:inline-block;
                    width: 0;
                    height: 0;
                    border-style: solid;
                    border-top: 7px solid transparent;
                    border-bottom: 7px solid transparent;
                    border-left: 12px solid #0062b1;
                    border-right: 0;
                    margin-right:15px;
                    @media screen and (max-width:$newbreak-tb) {
                        border-top: 5px solid transparent;
                        border-bottom: 5px solid transparent;
                        border-left: 8px solid #0062b1;
                        margin-right:5px;
                    }
                }
                &:nth-of-type(1) {
                    color:$second-color;
                    background:#fff;
                    margin-right:15px;
                    @media screen and (max-width:$newbreak-tb) {
                        margin-right:10px;
                    }
                }
                &:nth-of-type(2) {
                    color:#fff;
                    background:$second-color;
                    &:before {
                        border-left: 12px solid #fff;
                    }
                }
            }
        }
    }
    .imagebox {
        margin-top:20px;
        display:flex;
        align-items: center;
        @media screen and (max-width:$newbreak-sp) {
            flex-direction: column;;
        }
        p {
            width:512px;
            @media screen and (max-width:$newbreak-sp) {
                width:100%;
                max-width:90%;
                margin:0 auto 10px;
            }
        }
        .image {
            width:530px;
            @media screen and (max-width:$newbreak-sp) {
                width:100%;
            }
        }
    }
}

/*アンダーナビ*/
.undernav {
    padding:0 10px;
    ul {
        border-top:1px solid $second-color;
        max-width:1000px;
        margin:0 auto;
        padding:20px 0 0;
        display:flex;
        justify-content: center;
        flex-wrap:wrap;
        li {
            margin:10px 20px;
            font-family:$jpfont;
            @include font-style(14px,700,0,1);
            a {
                display:block;
                color:#000;
            }
        }
    }
}