@charset "utf-8";

/* ---------------------------------------
	max-width: 1024px
--------------------------------------- */

/************************************************************

     Layout | max-width: 1200px

************************************************************/

@media screen and (max-width: 1200px) {
    .c-hero__awards{
        width: 100%;
        height: 56.25vw;
        background-image: url(../images/c_hero_awards_bg_pc.jpg);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
    }
}/* max-width: 1200px */


/* ---------------------------------------
	max-width: 1024px
--------------------------------------- */

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

    html { font-size:  16px; }

}/* max-width: 1024px */


/* ---------------------------------------
	max-width: 800px
--------------------------------------- */

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

    html { font-size:  14px; }

}/* max-width: 800px */


/* ---------------------------------------
	max-width: 600px
--------------------------------------- */

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

    /************************************************************

         Contents | General Settings

    ************************************************************/

    .content{
        position: relative;
        margin: 80px 0 0 0;
    }
    .__pc{ display: none; }
    .__sp{ display: block; }

    /************************************************************

         Hero

    ************************************************************/
    .c-hero{
        padding: 0;
    }
    .c-hero::after{
        display: none;
    }
    .c-hero__pc{ display: none; }
    .c-hero__sp{ display: block; }
    .c-hero__awards{
        position: relative;
        width: 100%;
        height: 156vw;
        background-image: url(../images/c_hero_awards_bg_sp.jpg);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
    }
    .c-hero__awards .__ttl{
        position: absolute;
        width: 85.6%;
        background: rgba(255,255,255,0.9);
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        border-radius: 1.2vw;
        overflow: hidden;
    }
    .c-hero__awards .__ttl .__head{
        padding: 5.6vw;
        text-align: center;
    }
    .c-hero__awards .__ttl .__head h2{
        font-size: 1.6em;
    }
    .c-hero__awards .__ttl .__body{
        padding: 6.4vw;
    }
    .c-hero__awards .__ttl .__body .__num{
        margin-bottom: 4.8vw;
    }
    .c-hero__awards .__ttl .__body .__num h3{
        font-size: 1.4em;
    }
    .c-hero__awards .__ttl .__body .__num h3 span{
        font-size: 1.8em;
    }
    .c-hero__awards .__ttl .__body .__anchor{
        margin: 0 -6.4vw;
    }
    .c-hero__awards .__ttl .__body .__anchor .__item{
        padding: 3.2vw 0;
    }
    .c-hero__awards .__ttl .__body .__anchor .__item.__left{
        border-right: 3px solid #e5b800;
    }
    .c-hero__awards .__ttl .__body .__anchor .__item a{
        font-size: .9em;
    }
    .c-hero__awards .__ttl .__body .__anchor .__item figure img{
        width: 48px;
        height: auto;
    }

    /************************************************************

         Awards

    ************************************************************/

    .c-awards{
        margin: -100px 0 9.6vw;
        padding-top: 100px;
    }
    .c-awards__inner{
        padding: 9.6vw 3.6vw;
    }
    .c-awards__item{
        margin: -80px 0 0;
        padding: 80px 0 0;
    }
    .c-awards__item.__tw{
        margin-bottom: 6.4vw;
    }
    .c-awards__item .__head{
        padding: 9.6vw 0 0;
        margin: 0 0 4.8vw;
        background-position: top center;
        background-size: 100%;
    }
    .c-awards__item .__head h2{
        position: relative;
        text-align: center;
        font-weight: 900;
    }
    .c-awards__item.__tw .__head h2::before,
    .c-awards__item.__ig .__head h2::before{
        width: 42px;
        height: 35px;
        margin: 0 auto .75em;
    }
    .__awards .__subhead{
        margin-bottom: 3.6vw;
    }
    .__awards .__subhead h3{
        font-size: 1.6em;
    }
    .__awards .__gold{
        margin:0 0 9.6vw;
    }
    .__awards .__gold .__column{
        padding: 5.6vw;
    }
    .__awards .__gold .__column .__img{
        width: 100%;
        margin: 0 0 4.8vw;
    }
    .__awards .__gold .__column .__txt{
        width: 100%;
        padding: 3.2vw;
    }
    .__awards .__gold .__column .__txt p.__name{
        position: relative;
        margin: 0 0 5.6vw;
        text-align: center;
        font-size: 1.5em;
        font-weight: 900;
    }
    .__awards .__gold .__column .__txt p.__name::before{
        width: 63px;
        height: 56px;
    }
    .__awards .__gold .__column .__txt p.__name span{
        margin-left: .25em;
        font-size: .6em;
    }
    .__awards .__gold .__column .__txt p.__comment{
        font-size: 1.0em;
        line-height: 1.8;
    }
    .__awards .__gold .__column .__txt p.__comment em{
        display: block;
        font-size: 1.0em;
        font-weight: 700;
        margin-bottom: .5em;
        text-align: center;
    }
    .__awards .__silver{
        margin:0 0 9.6vw;
    }
    .__awards .__silver .__column{
        display: flex;
        flex-wrap: wrap;
        margin: 0 -1.5%;
    }
    .__awards .__silver .__column .__item{
        width: 47%;
        margin: 0 1.5%;
    }
    .__awards .__bronze .__column{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        margin: 0 -1.5% -4.8%;
    }
    .__awards .__bronze .__column .__item{
        width: 47%;
        margin: 0 1.5% 4.8%;
    }
    .__awards .__silver .__column .__item .__img,
    .__awards .__bronze .__column .__item .__img{
        margin-bottom: 1.0em;
    }
    .__awards .__silver .__column .__txt p.__name,
    .__awards .__bronze .__column .__txt p.__name{
        font-size: 1.1em;
    }
    .__awards .__silver .__column .__txt p.__name span,
    .__awards .__bronze .__column .__txt p.__name span{
        font-size: .6em;
    }
    .__awards .__silver .__column .__txt p.__comment,
    .__awards .__bronze .__column .__txt p.__comment{
        font-size: 1.0em;
        line-height: 1.6;
        padding: 0;
    }
    .__awards .__bronze .__column .__txt p.__cat{
        font-size: .8em;
    }

    /************************************************************

         About

    ************************************************************/
    .c-about{
        margin: -80px 0 12.8vw;
        padding-top: 80px;
    }
    .c-about__head{
        margin: 0 0 4.8vw;
    }
    .c-about__head h2{
        text-align: center;
        font-size: 1.2em;
        background-size: 150%;
    }
    .c-about__head h2 span{
        display: inline-block;
        background-color: #fff;
        padding: 0 12px;
    }
    .c-about__body table{
        width: 100%;
        display: block;
    }
    .c-about__body table tr{
        width: 100%;
        border-top: 1px solid #f6c900;
    }
    .c-about__body table tr th{
        display: block;
        padding: 3.6vw 1.2vw .6vw;
        border-top: none;
        width: 100%;
        font-size: .85em;
    }
    .c-about__body table tr td{
        display: block;
        padding: 0 1.2vw 3.6vw;
        border-top: none;
        width: 100%;
        font-weight: 700;
        color: #666;
        line-height: 1.5;
        font-size: .85em;
    }
    .c-about__body table tr td ul li{
        margin-left: 1.5em;
    }

    /************************************************************

         Prize

    ************************************************************/

    .c-prize{
        margin: -80px 0 12.8vw;
        padding-top: 80px;
    }
    .c-prize__inner{
        position: relative;
        margin: 0;
        background: #f4f1e8;
        padding: 9.6vw 6.4vw;
    }
    .c-prize__head{
        margin: 0 0 4.8vw;
    }
    .c-prize__head h2{
        font-size: 1.2em;
        background-size: 150%;
    }
    .c-prize__head h2 span{
        display: inline-block;
        background-color: #f4f1e8;
        padding: 0 12px;
    }
    .c-prize__head p{
        margin: 3.2vw 0 0;
        text-align: center;
        font-size: .9em;
        line-height: 1.5;
    }
    .c-prize__body .__gold{
        border: 1.6vw solid #cbb03e;
        border-radius: 3.2vw;
    }
    .c-prize__body .__silver{
        border: 1.6vw solid #a9a9a9;
        border-radius: 3.2vw;
    }
    .c-prize__body .__bronze{
        border: 1.6vw solid #cc8e66;
        border-radius: 3.2vw;
    }
    .c-prize__body .__column{
        margin: 3.2vw 0 4.8vw;
    }
    .c-prize__body .__column .__item{
        width: 100%;
        margin: 3.2vw 0;
    }
    .c-prize__more{
        width: 100%;
    }
    .c-prize__more .__column{
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }
    .c-prize__more .__column .__img{
        width: 30%;
        margin-right: 4%;
    }
    .c-prize__more .__column .__txt{
        width: 66%;
    }
    .c-prize__more .__column .__txt p{
        font-size: 1.0em;
    }

    /************************************************************

         How

    ************************************************************/

    .c-how{
        position: relative;
        margin: -80px 0 12.8vw;
        padding-top: 80px;
    }
    .c-how__head{
        margin: 0 0 4.8vw;
        background-size: 150%;
    }
    .c-how__head h2{
        font-size: 1.2em;
    }
    .c-how__head h2 span{
        padding: 0 12px;
    }
    .c-how__body .__head .__num{
        display: inline-block;
        width: 45px;
        height: 45px;
        line-height: 45px;
        font-size: 1.0em;
        margin-bottom: .25em;
    }
    .c-how__body .__head h3{
        font-size: 1.2em;
        font-weight: 900;
        line-height: 1.5;
    }
    .c-how__body .__column{
        margin: 3.6vw 0 4.8vw;
    }
    .c-how__body .__column .__item{
        width: 100%;
        margin: 0 0 3.2vw;
    }
    .c-how__body .__column .__item a{
        display: block;
        background: #9feaf9;
        border-radius: 1.2vw;
        padding: 4.8vw;
    }
    .c-how__body .__column .__item .__acount .__icon{
        width: 26%;
        margin-right: 4%;
    }
    .c-how__body .__column .__item .__acount .__name{
        width: 60%;
    }
    .c-how__body .__column .__item .__acount .__name p{
        font-weight: 900;
        line-height: 1.5;
    }
    .c-how__body .__column .__item .__acount .__name p span{
        font-size: .8em;
        font-weight: 700;
    }
    .c-how__body .__box{
        display: block;
        background: #9feaf9;
        border-radius: 1.2vw;
        margin: 3.6vw 0 6.4vw;
        padding: 4.8vw;
        text-align: center;
    }
    .c-how__body .__box p{
        font-size: 1.0em;
        font-weight: 900;
        line-height: 3.2;
    }
    .c-how__body .__box p span{
        display: block;
        background: #fff;
        width: 100%;
        margin: 0.5em 0;
        color: #dd007f;
        white-space: nowrap;
    }
    .c-how__example .__head{
        margin: 0 0 4.8vw;
    }
    .c-how__example .__head h3{
        font-weight: 900;
        font-size: 1.2em;
    }
    .c-how__example .__column{
        margin: 0 -1.5% 6.4vw;
        justify-content: center;
    }
    .c-how__example .__column .__item{
        width: 47%;
        margin: 0 1.5% 4.8vw;
    }
    .c-how__example .__column .__item figure{
        margin-bottom: 2.4vw;
    }
    .c-how__example .__column .__item figure img{
        width: 100%;
    }
    .c-how__example .__column .__item p{
        font-size: .8em;
    }
    .c-how__attention{
        margin: 0 0 6.4vw;
    }
    .c-how__attention p{
        font-size: 1.2em;
    }

    /************************************************************

         Notice

    ************************************************************/

    .c-notice{
        position: relative;
        margin: -80px 0 12.8vw;
        padding-top: 80px;
    }
    .c-notice__head{
        margin-bottom: 4.8vw;
    }
    .c-notice__head h2{
        font-size: 1.2em;
    }
    .c-notice__head p{
        margin: .75em 0 0;
        font-size: .85em;
    }
    .c-notice__body{
        margin-bottom: 6.4vw;
    }
    .c-notice__body ul li{
        font-size: .8em;
        margin-left: 1.8em;
    }

}/* max-width: 600px */


/* ---------------------------------------
	max-width: 480px
--------------------------------------- */

@media screen and (max-width: 480px) {}/* max-width: 480px */


/* ---------------------------------------
	max-width: 320px
--------------------------------------- */

@media screen and (max-width: 320px) {
    html { font-size:  13px; }
}/* max-width: 320px */