@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&family=Zen+Maru+Gothic:wght@900&display=swap');

/* 冷凍うどんで夏休みの自由研究 2022/06 */

/* common setting */

/* 画像リンク */
#main a:hover img {
    opacity:0.7;
    filter:alpha(opacity=70);
    -ms-filter:"alpha( opacity=70 )";
    transition:0.5;
    transition-duration:0.3s;
}

body {
    position:relative;
    overflow-x:hidden;
}

#navHeader {
    margin-bottom:0 !important;
    z-index:100;
}

.pc {}
.sp {display:none;}


/* common setting END */


/* PCレイアウト */
/*-------------------------------------------*/
#contents {
    padding-bottom: 40px;
    font-family: 'Noto Sans JP', sans-serif;
    line-height:1.8;
    font-size:1.4em;
    font-weight: 700;
    color:#000000;
}
#contents img {
    max-width:100%;
    height:auto;
}

#contents * {box-sizing: border-box;}

.sp {display:none;}

#contents ruby {
    ruby-align: center;
}


/* キャンペーンバナー */
#banner {
    display: none;
    position: relative;
    transition: all .3s ease;
}
#banner.fixed.none {
    opacity: 0;
    z-index: -1;
}
#banner.fixed {
    display: block;
    position:fixed;
    right:50%;
    bottom:7%;
    width:30%;
    max-width:280px;
    transform: translateX(550px);
    z-index:9990;
}
#banner.fixed a:hover img {
    opacity: inherit;
}
#banner.fixed a img.ban_img_o {
    display: none;
}
#banner.fixed a:hover img.ban_img_o {
    display: block;
}
#banner.fixed a:hover img.ban_img {
    display: none;
}
#banner.fixed .close {
    display:block;
    position:absolute;
    top:2.7%;
    right:9.5%;
    width:16%;
    height:10.2%;
    border-radius:50%;
    transition:all .3s ease;
    z-index:10000;
    cursor:pointer;
}
@media only screen and (max-width: 1100px) {
    #banner.fixed {
        right: 2%;
        transform: none;
    }
}
@media only screen and (max-width: 750px) {
    #banner.fixed {
        right: 2%;
        bottom:9%;
        width:36%;
        max-width:inherit;
        transform: none;
    }
}


/* キャンペーンバナー：終了 */
#fin_banner {
    display: none;
    position: relative;
    transition: all .3s ease;
}
#fin_banner.fixed.none {
    opacity: 0;
    z-index: -1;
}
#fin_banner.fixed {
    display: block;
    position:fixed;
    right:0;
    left:0;
    bottom:7%;
    width:80%;
    max-width:800px;
    margin: auto;
    z-index:9990;
}
/* 閉じる */
#fin_banner .close {
    display:block;
    position:absolute;
    top:0;
    right:50%;
    width:30px;
    height:30px;
    background-color:#333333;
    background-repeat:no-repeat;
    background-position:center center;
    background-image:url("../images/fin_ban_close.png");
    background-size:50%;
    border-radius:50%;
    font-size:35px;
    font-weight:bold;
    color:#ffffff;
    transform:translateX(1350%);
    transition:all .3s ease;
    z-index:10000;
    content:"×";
    cursor:pointer;
}
#fin_banner .close:hover {
    background-color:#7f7f7f;
}
@media only screen and (max-width: 949px) {
    #fin_banner .close {
        right:-2%;
        transform:translateX(0);
    }
}
@media only screen and (max-width: 640px) {
    #fin_banner.fixed {
        bottom:20%;
        width:80%;
        max-width:620px;
    }
    #fin_banner .close {
        top:-6%;
        right: 0;
    }
}


/* セクション背景 */
#sec00 {background-color: #f1ebe3;}
#sec01 {background-color: #f4cf41;}
#sec02 {background-color: #9fd9f6;}
#sec03 {background-color: #5bbde7;}
#sec04 {background-color: #5bbde7;}

.bg-sec {
    position: relative;
    background-repeat: no-repeat;
    background-position: center top;
}
.bg-sec.bg-sec00-01 {
    height:346px;
    background-image: url("../images/bg_sec00_01_2000.png");
    margin-top: 40px;
}
.bg-sec.bg-sec01-02 {
    height:356px;
    background-image: url("../images/bg_sec01_02_2000.png");
}
.bg-sec.bg-sec02-03 {
    height:246px;
    background-image: url("../images/bg_sec02_03_2000.png");
}

.bg-sec04 {
    background-repeat: repeat-x;
    background-position: center top;
}
.bg-sec04.bg-top {
    height:38px;
    background-image: url("../images/bg_sec03_04_pc.png");
}
.bg-sec04.bg-bottom {
    height:37px;
    background-color: #5bbde7;
    background-image: url("../images/bg_bottom_sp.png");
    margin-bottom: 30px;
    padding-bottom: 180px;
}


/* ネガティブマージン */
#sec01 h2 {
    margin-top: -280px;
}
.bg-sec.bg-sec01-02 {
    margin-top: -160px;
}
#sec02 h2 {
    margin-top: -190px;
}
.bg-sec.bg-sec02-03 {
    margin-top: -90px;
}
#sec03 h2 {
    margin-top: -140px;
}

/* 各タイトル */
#sec01 h2,
#sec02 h2,
#sec03 h2 {
    position: relative;
    z-index: 1;
}


/* 印刷ボタン共通 */
.report-block {
    position: relative;
    width:28em;
    background-repeat: no-repeat;
    background-position: right bottom;
    background-image: url("../images/icon_print.png");
    margin: 0 auto;
    padding-top: 1em;
    padding-bottom: 1.6%;
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size:1.2em;
    letter-spacing: -0.025em;
    z-index: 1;
}
.report-block p {
    margin-bottom: 0.5em;
}


/* リード共通 */
p.lead {
    width:94%;
    max-width: 950px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1em;
    padding-top: 1em;
    font-size:1.3em;
}


/* sec00 */
#sec00 .lead {
    width:94%;
    max-width: 950px;
    margin: 0 auto;
}
#sec00 .lead p {
    line-height: 2.0;
    font-size:1.35em;
}
#sec00 .flow {
    position: relative;
    width:94%;
    max-width: 950px;
    margin: 0 auto;
}
#sec00 .report {
    width:56%;
    max-width:430px;
    margin-left: auto;
}


/* anchor */
.flow a.anchor {
    display: block;
    position:absolute;
    width:42%;
    height: 50%;
    border-radius: 24px;
}
.flow a.anchor01 {
    right: 4.5%;
    bottom: 16%;
}
.flow a.anchor02 {
    top: -32.5%;
    left: 0.3%;
}
.flow a.anchor03 {
    left: 15%;
    bottom: 17.4%;
}

/* 国際うどん大学バナー */
.univ {
    width: 94%;
    max-width: 950px;
    margin: 0 auto;
    padding-top: 2%;
    text-align: right;
}
.univ a {
    display: block;
    width: 45.5%;
    max-width: 460px;
    margin-left: auto;
}


/* sec01 */
#sec01 ul.gotochi {
    width:94%;
    max-width: 950px;
    margin: 0 auto;
    text-align: center;
    letter-spacing: -0.5em;
}
#sec01 ul.gotochi li {
    display: inline-block;
    width:32%;
    margin-bottom: 3%;
    vertical-align: top;
    letter-spacing: normal;
}
#sec01 ul.gotochi li:nth-child(1),
#sec01 ul.gotochi li:nth-child(3) {
    padding-top: 16%;
}
#sec01 ul.gotochi li:nth-child(5),
#sec01 ul.gotochi li:nth-child(8),
#sec01 ul.gotochi li:nth-child(10) {
    margin-top: -16%;
}
#sec01 .report-block {
    padding-top: 0;
}


/* sec02 */
#sec02 .memo {
    position: relative;
    width: 92%;
    max-width: 686px;
    margin-left: auto;
    margin-right: auto;
}
#sec02 .memo.memo01 {
    margin-bottom: 15px;
}
#sec02 .memo.memo02 {
    margin-bottom: 20px;
}
#sec02 .memo a {
    position: absolute;
    display: block;
    left:0;
    right:0;
    width:38%;
    max-width: 260px;
    margin: auto;
}
#sec02 .memo.memo01 a {
    bottom:4%;
}
#sec02 .memo.memo02 a {
    bottom:15%;
}


/* sec03 */
#sec03 {
    padding-bottom: 60px;
}
#sec03 h3 {
    margin-bottom: 30px;
}
#sec03 ul.recipe {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width:94%;
    max-width: 950px;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-image: url("../images/sec03_line_pc.png");
    background-size: contain;
    margin: 0 auto 40px;
    padding-bottom: 40px;
}
#sec03 ul.recipe li {
    width:32%;
    margin-bottom: 2%;
}
#sec03 ul.recipe-b {
    margin: 0 auto 80px;
}
#sec03 ul.recipe li a {
    display: block;
    width:100%;
    height:0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    padding-top:95.918%;
    text-indent: -9999px;
}

#sec03 ul.recipe.recipe-a li:nth-child(2) a {background-image: url("../images/sec03_recipe_a01.png");}
#sec03 ul.recipe.recipe-a li:nth-child(3) a {background-image: url("../images/sec03_recipe_a02.png");}
#sec03 ul.recipe.recipe-a li:nth-child(4) a {background-image: url("../images/sec03_recipe_a03.png");}
#sec03 ul.recipe.recipe-a li:nth-child(5) a {background-image: url("../images/sec03_recipe_a04.png");}
#sec03 ul.recipe.recipe-a li:nth-child(6) a {background-image: url("../images/sec03_recipe_a05.png");}

#sec03 ul.recipe.recipe-a li:nth-child(2) a:hover {background-image: url("../images/sec03_recipe_a01_o.png");}
#sec03 ul.recipe.recipe-a li:nth-child(3) a:hover {background-image: url("../images/sec03_recipe_a02_o.png");}
#sec03 ul.recipe.recipe-a li:nth-child(4) a:hover {background-image: url("../images/sec03_recipe_a03_o.png");}
#sec03 ul.recipe.recipe-a li:nth-child(5) a:hover {background-image: url("../images/sec03_recipe_a04_o.png");}
#sec03 ul.recipe.recipe-a li:nth-child(6) a:hover {background-image: url("../images/sec03_recipe_a05_o.png");}

#sec03 ul.recipe.recipe-b li:nth-child(2) a {background-image: url("../images/sec03_recipe_b01.png");}
#sec03 ul.recipe.recipe-b li:nth-child(3) a {background-image: url("../images/sec03_recipe_b02.png");}
#sec03 ul.recipe.recipe-b li:nth-child(4) a {background-image: url("../images/sec03_recipe_b03.png");}
#sec03 ul.recipe.recipe-b li:nth-child(5) a {background-image: url("../images/sec03_recipe_b04.png");}
#sec03 ul.recipe.recipe-b li:nth-child(6) a {background-image: url("../images/sec03_recipe_b05.png");}

#sec03 ul.recipe.recipe-b li:nth-child(2) a:hover {background-image: url("../images/sec03_recipe_b01_o.png");}
#sec03 ul.recipe.recipe-b li:nth-child(3) a:hover {background-image: url("../images/sec03_recipe_b02_o.png");}
#sec03 ul.recipe.recipe-b li:nth-child(4) a:hover {background-image: url("../images/sec03_recipe_b03_o.png");}
#sec03 ul.recipe.recipe-b li:nth-child(5) a:hover {background-image: url("../images/sec03_recipe_b04_o.png");}
#sec03 ul.recipe.recipe-b li:nth-child(6) a:hover {background-image: url("../images/sec03_recipe_b05_o.png");}

#sec03 .pin-block {
    position: relative;
    width:84%;
    max-width: 730px;
    background-color: #ffffff;
    background-size: contain;
    margin: 0 auto 80px;
    padding: 4% 8%;
}
#sec03 .pin-block h4 {
    margin-bottom: 1em;
    font-size: 1.4em;
}
#sec03 .pin-block ul {
    list-style: disc;
    text-align: left;
    font-size: 1.1em;
}
#sec03 .pin-block ul li {
    margin-bottom: 0.25em;
}
#sec03 .pin-block .pin {
    position: absolute;
    top:-5%;
    left:0;
    right:0;
    margin: auto;
}
#sec03 .pin-block .girl {
    position: absolute;
    right: 3%;
    bottom: -6%;
    width: 20%;
}

#sec03 .acc-block {
    position: relative;
    width:84%;
    max-width: 730px;
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-image: url("../images/sec03_acc_bottom_pc.png");
    background-size: contain;
    margin: 0 auto 40px;
    padding-bottom: 2.186%;
}
#sec03 .acc-block input {
    display: none;
}
#sec03 .acc-block label {
    display: block;
    width:100%;
    height:0;
    background-repeat: no-repeat;
    background-position: center top;
    background-image: url("../images/sec03_acc_label_pc.png");
    background-size: contain;
    padding-top: 10.237%;
    text-indent: -9999px;
    cursor: pointer;
}
#sec03 .acc-block .acc-cont {
    display: none;
    height: 0;
    background-color: #ffffff;
    padding: 0 4%;
    text-align: left;
    opacity: 0;
    transition: all .3s ease;
}
#sec03 .acc-block input:checked ~ label {
    background-image: url("../images/sec03_acc_label_open_pc.png");
}
#sec03 .acc-block input:checked ~ .acc-cont {
    display: block;
    height: auto;
    opacity: 1;
}
#sec03 .acc-block ul {
    padding: 4% 0;
}
#sec03 .acc-block ul > li {
    margin-bottom: 0.5em;
    padding-left: 1em;
    text-indent: -1em;
}
#sec03 .acc-block ul > li:before {
    content:"●";
}
#sec03 .acc-block ul > li ul {
    padding-left: 1.5em;
}
#sec03 .acc-block ul > li ul li {
    list-style: disc;
    margin-bottom: 0.5em;
    padding-left: 0;
    text-indent: 0;
}
#sec03 .acc-block ul > li ul li:before {
    content:"";
}


/* sec04 */
#sec04 {
    padding-bottom: 40px;
}
#sec04 .bg-sec04-top {
    width: 100%;
    max-width: 1075px;
    height: 30px;
    background-repeat: no-repeat;
    background-position: center top;
    background-image: url("../images/bg_sec04_top_pc.png");
    margin: 0 auto;
}
#sec04 .sec04-inner {
    width: 100%;
    max-width: 1075px;
    background-repeat: repeat-y;
    background-position: center top;
    background-image: url("../images/bg_sec04_pc.png");
    margin: 0 auto;
    padding: 60px 0 20px;
}
#sec04 h2 {
    margin-bottom: 40px;
}
#sec04 h3 {
    width:48%;
    max-width: 452px;
    margin: 0 auto 20px;
}
#sec04 p.deadline {
    width:62%;
    max-width: 580px;
    margin: 0 auto 50px;
}
#sec04 p.prize {
    width:82%;
    max-width: 770px;
    margin: 0 auto;
}
#sec04 p.campaign {
    width:52%;
    max-width: 480px;
    margin: 0 auto;
}
#sec04 p.campaign-btn {
    width:52%;
    max-width: 430px;
    margin: 0 auto 20px;
}
#sec04 p.terms {
    position: relative;
    width:50%;
    max-width: 360px;
    margin: 0 auto 40px;
}
#sec04 p.terms a {
    display: block;
    position: absolute;
    top: 5%;
    left: 35.5%;
    width: 18.5%;
    height: 2.25em;
}





/* 949px以下 */
/*-------------------------------------------*/
@media only screen and (max-width: 949px) {

/* common setting */

img, object, embed, video {
    max-width:100%;
    height:auto;
}

#navHeader {
    height:20px;
}

.pagetop_sp {z-index:9999;} 

/* common setting END */

#contents {
    font-size:1.2em;
}

/* セクション背景 */
.bg-sec.bg-sec00-01 {
    height:205px;
    background-image: url("../images/bg_sec00_01_950.png");
    margin-top: 40px;
}
.bg-sec.bg-sec01-02 {
    height:240px;
    background-image: url("../images/bg_sec01_02_950.png");
}
.bg-sec.bg-sec02-03 {
    height:200px;
    background-image: url("../images/bg_sec02_03_950.png");
}


/* ネガティブマージン */
#sec01 h2 {
    margin-top: -130px;
}
.bg-sec.bg-sec01-02 {
    margin-top: -150px;
}
#sec02 h2 {
    margin-top: -40px;
}
.bg-sec.bg-sec02-03 {
    margin-top: -70px;
}
#sec03 h2 {
    margin-top: -120px;
}



}
/*-------------------------------------------*/
/* 949px以下 END */



/* 750px以下 */
/*-------------------------------------------*/
@media only screen and (max-width: 750px) {

/* common setting */

#navHeader {
    height:4.5em;
}

.pagetop_sp {z-index:9999;}

.pc {display:none;}
.sp {display:block;}

/* common setting END */




/* セクション背景 */
.bg-sec.bg-sec00-01 {
    height:175px;
    background-image: url("../images/bg_sec00_01_sp.png");
    margin-top: 0;
}
.bg-sec.bg-sec01-02 {
    height:185px;
    background-image: url("../images/bg_sec01_02_sp.png");
}
.bg-sec.bg-sec02-03 {
    height:145px;
    background-image: url("../images/bg_sec02_03_sp.png");
}
.bg-sec04 {
    background-repeat: no-repeat;
    background-size: contain;
}
.bg-sec04.bg-top {
    height:0;
    background-image: url("../images/bg_sec03_04_sp.png");
    padding-top: 2.666%;
}
.bg-sec04.bg-bottom {
    height:0;
    background-image: url("../images/bg_bottom_sp.png");
    padding-top: 3.733%;
    margin-bottom: 8%;
    padding-bottom: 18%;
}


/* ネガティブマージン */
#sec01 h2 {
    margin-top: -130px;
}
.bg-sec.bg-sec01-02 {
    margin-top: -80px;
}
#sec02 h2 {
    margin-top: -100px;
}
.bg-sec.bg-sec02-03 {
    margin-top: -40px;
}
#sec03 h2 {
    margin-top: -100px;
}

/* リード */
#sec00 .lead p {
    font-size: 4.2vw;
}
p.lead {
    font-size:3.6vw;
}

/* 印刷ボタン共通 */
.report-block {
    background-size: 22%;
    padding-bottom: 5.6%;
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size:3.2vw;
}
.report-block p:last-child {
    width:48%;
    margin: 0 auto;
}


/* anchor */
.flow a.anchor {
    width:64%;
}
.flow a.anchor01 {
    right: 18%;
    bottom: 10%;
    height: 39%;
}
.flow a.anchor02 {
    top: 5.2%;
    left: 18%;
    height: 24.2%;
}
.flow a.anchor03 {
    left: 18.2%;
    bottom: 34.6%;
    height: 24.5%;
}

/* 国際うどん大学バナー */
.univ {
    width: 94%;
    padding-top: 5%;
    text-align: center;
}
.univ a {
    width: 75%;
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
}


/* sec03 */
#sec03 {
    padding-bottom: 8%;
}
#sec03 h3 {
    margin-bottom: 4%;
}
#sec03 ul.recipe {
    justify-content: center;
    background-image: url("../images/sec03_line_sp.png");
    margin: 0 auto 12%;
    padding-left: 6%;
    padding-bottom: 8%;
}
#sec03 ul.recipe li {
    width:46%;
    margin-right: 4%;
    margin-bottom: 4%;
}

#sec03 .pin-block {
    width:100%;
    max-width: 750px;
    margin: 0 auto 8%;
    padding: 4% 8% 8%;
}
#sec03 .pin-block h4 {
    font-size: 3.8vw;
}
#sec03 .pin-block ul {
    font-size: 3.0vw;
}
#sec03 .pin-block ul li:last-child {
    padding-right: 18%;
}
#sec03 .pin-block .girl {
    bottom: -3%;
}

#sec03 .acc-block ul {
    font-size: 2.8vw;
}
#sec03 .acc-block {
    position: relative;
    width:84%;
    max-width: 654px;
    background-image: url("../images/sec03_acc_bottom_sp.png");
    margin: 0 auto 8%;
    padding-bottom: 2.32%;
}
#sec03 .acc-block label {
    background-image: url("../images/sec03_acc_label_sp.png");
    padding-top: 11.75%;
}
#sec03 .acc-block input:checked ~ label {
    background-image: url("../images/sec03_acc_label_open_sp.png");
}


/* sec04 */
#sec04 {
    padding-bottom: 40px;
}
#sec04 .bg-sec04-top {
    height: 30px;
    background-image: url("../images/bg_sec04_top_sp.png");
    background-size: cover;
}
#sec04 .sec04-inner {
    background-image: url("../images/bg_sec04_sp.png");
    background-size: contain;
    margin: 0 auto;
    padding: 10px 0 10px;
}
#sec04 h2 {
    margin-bottom: 6%;
}
#sec04 h3 {
    width:62%;
    margin: 0 auto 3%;
}
#sec04 p.deadline {
    width: 78%;
    margin: 0 auto 8%;
}
#sec04 p.prize {
    width:78%;
    max-width: 580px;
}
#sec04 p.campaign {
    width:64%;
}
#sec04 p.campaign-btn {
    width:64%;
}



}
/*-------------------------------------------*/
/* 750px以下 END */



/* 320px以下 */
/*-------------------------------------------*/
@media only screen and (max-width: 320px) {






}
/*-------------------------------------------*/
/* 320px以下 END */