@charset "utf-8";

#main {
    padding: 10px;
    display: block;
}

#main h1, #main h2 {
    padding: 0;
    margin: 0;
}

.onayami-entry__block {
    padding-top: 35px;
    padding-bottom: 35px;
    background-image: url(/hoshino_template/nayami_bg.jpg);
    background-position: center;
    background-size: cover;
}

.onayami-entry__block p {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 0px;
    text-shadow:
        2px 2px 0px #fff, -2px -2px 0px #fff,
        -2px 2px 0px #fff, 2px -2px 0px #fff,
        2px 0px 0px #fff, -2px -0px 0px #fff,
        0px 2px 0px #fff, 0px -2px 0px #fff;
}

.entry-header {
    display: block;
    margin-top: 5px;
    margin-bottom: 40px;
}

.entry-header img {
    width: 100%;
}

#main .pc {
    display: block;
}

#main .sp {
    display: none;
}

#hoshino_template {
    display: block;
    position: relative;
}

#hoshino_template i.santa {
    display: block;
    max-width: 204px;
    height: auto;
    position: absolute;
    right: 55px;
    bottom: -120px;
}

#hoshino_template i.santa img {
    width: 100%;
}

.entry-read {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 40px;
    position: relative;
}
.entry-read:after{
    position: absolute;
    right: 0px;
    top: 10px;
    content: "";
    display: block;
    width: 100px;
    height: 119px;
    background-image: url('/wp/wp-content/themes/mamanowa/xmas2024/tonakai.png');
    background-size: contain;
    background-repeat: no-repeat;
    animation: loop_animation_right2 0.22s linear infinite;
}

@keyframes loop_animation_right2 {
    0% {
      transform: translateY(0px);
    }
    25% {
        transform: translateY(5px);
    }
    50% {
        transform: translateY(0px);
    }
    75% {
        transform: translateY(-5px);
    }
    100% {
      transform: translateY(0px);
    }
  }

.entry-read p {
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
    color: #C41815;
}

.entry-ancher {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 40px;
}

.entry-ancher ul {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    list-style: none;
}
.entry-ancher ul li {
    margin: 0px 10px;
}
.entry-ancher ul li a{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 30px;
    border: solid 4px #dddd;
    border-radius: 100px;
    min-width: 260px;
    text-align: center;
    box-sizing: border-box;
}
.entry-ancher ul li a img{
    display: block;
    height: 26px;
    width: auto;
}

.entry-ancher ul li a.entry-ancher-btn1{
    border-color: #12501B;
}

.entry-ancher ul li a.entry-ancher-btn2{
    border-color: #C41815;
}

.sub_title__block {
    box-shadow: 0 0 2px rgba(100,100,100,0.5);
    padding: 10px 30px;
    border: solid 4px #fff;
    border-radius: 100px;
    background-color: #ddd;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sub_title__block.sagashikata_w{
    background-color: #12501B;
}

.sub_title__block.join_can_ttl_w{
    background-color: #C41815;
}

.sub_title__block.oubohouhou_w{
    background-color: #C41815;
}

.sub_title__block h2 img{
    display: block;
    height: 26px;
    width: auto;
}
.sagashikata_intro{
    padding-top: 20px;
}
.sagashikata_intro p{
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
    color: #C41815;
}


.h_boader .entry-content .intro h2:before,
.h_boader .entry-content .intro h2:after {
    display: none;
}

.intro {
    max-width: 820px;
    margin-left: auto;
    margin-right: auto;
    background-color: #efefef;
    border-radius: 10px;
    padding: 25px 80px;
    margin-bottom: 60px;
}

#main .entry-content .intro h2 {
    border: none;
    text-align: center;
    font-size: 18px;
    margin-bottom: 20px;
}

#main .entry-content .intro img+p {
    margin-top: 10px;
}

.h_boader .entry-content .sub_title__block h2 {
    padding: 0;
    margin: 0;
    border: none;
    text-align: center;
}

.h_boader .entry-content .sub_title__block h2 .pc {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.h_boader .entry-content .sub_title__block h2 .sp {
    display: none;
}

.intro img {
    width: 100%;
    height: auto;
}

.h_boader .entry-content .sub_title__block h2:before,
.h_boader .entry-content .sub_title__block h2:after {
    display: none;
}

.list__block {
    margin-top: 50px;
    margin-bottom: 10px;
    display: block;
    max-width: 1040px;
    margin-left: 20px;
    margin-right: 20px;
}

.list__inner{
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
    width: calc(100% + 30px);
}

.list__block .list{
    border: solid 4px #C41815;
    border-radius: 15px;
    margin-left: 15px;
    margin-right: 15px;
    width: calc((100% - 30px*2)/2);
    margin-bottom: 50px;
}

.list__block .list .list-header{
    position: relative;
    top: -28px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 180px;
    background-color: #C41815;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding:15px 20px;
    box-shadow: 0 0 2px rgba(100, 100, 100, 0.5);
    border: solid 4px #fff;
}

.list__block .list.santa1{
    border-color: #C41815;
}
.list__block .list.santa1 .list-header{
    background-color: #C41815;
}

.list__block .list.santa2{
    border-color: #0f41b6;
}
.list__block .list.santa2 .list-header{
    background-color: #0f41b6;
}

.list__block .list.santa3{
    border-color: #1da723;
}
.list__block .list.santa3 .list-header{
    background-color: #1da723;
}

.list__block .list.santa4{
    border-color: #f1db1b;
}
.list__block .list.santa4 .list-header{
    background-color: #f1db1b;
}

.list__block .list.santa5{
    border-color: #c705d6;
}
.list__block .list.santa5 .list-header{
    background-color: #c705d6;
}

.list__block .list.santa6{
    border-color: #dda014;
}
.list__block .list.santa6 .list-header{
    background-color: #dda014;
}

.list__block .list.santa:hover .list-body>img{
    animation: loop_animation_right 0.22s linear infinite;
}

@keyframes loop_animation_right {
    0% {
      transform: translateX(0px);
    }
    25% {
        transform: translateX(5px);
    }
    50% {
        transform: translateX(0px);
    }
    75% {
        transform: translateX(-5px);
    }
    100% {
      transform: translateX(0px);
    }
  }
  

.list__block .list .list-header h3{
    padding: 0px;
    margin: 0px;
    background-color: transparent;
    vertical-align: top;
    line-height: 1em;
}

.list__block .list .list-header img{
    height: 20px;
    vertical-align: top;
}
.list__block .list .list-body{
    text-align: center;
}
.list__block .list .list-body>img{
    height: 230px;
    display: inline-block;
    margin: 0px auto;
    vertical-align: top;
}

.list-btns{
    padding-top: 10px;
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
}
.list-btns .list-btn{
    width: 240px;
    background-color: #12501B;
    border-radius: 100px;
    padding: 15px 20px;
}

.list-btns .list-btn img{
    display: block;
    height: 20px;
    margin: 0px auto;
}

.list-items__block {
    max-width: 930px;
    margin: 0px auto;
    margin-bottom: 40px;
}


.can___block{
    padding-top: 20px;
}

.can_read__block{
    padding-top: 20px;
}
.h_boader .entry-content .can_read__block p,
.can_read__block p{
    text-align: center;
    font-size: 18px;
}

.can___block img{
    max-width: 600px;
    display: block;
    margin: 0px auto;
    border-radius: 10px;
    margin-bottom: 40px;
}
.list-items {
    display: flex;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px;
    width: calc(100% + 20px);
}

.list-item {
    width: calc((100% - 20px*2)/2);
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 20px;
}

.list-item a {
    text-decoration: none;
    color: #333;
}

.list-item img {
    margin: 0 auto;
    display: block;
}

.entry-content table.p-teble {
    max-width: calc(100% - 30px);
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 20px;
    margin-top: 20px;
}


.p-teble tr th {
    text-align: left;
    white-space: nowrap;
}
.p-teble tr th strong,
.p-teble tr td strong{
    font-weight: bold;
    color: #C41815;
}

.p-teble tr th small,
.p-teble tr td small{
    font-size: 0.85em;
    line-height: 1.6em;
    display: inline-block;
}

.pp_text_area {
    max-width: 1000px;
    margin-left: 15px;
    margin-right: 15px;
    padding: 2.0em 2em;
    margin-bottom: 40px;
}

.pp_text_area p:last-child {
    margin-bottom: 0;
}

.btns__block {
    text-align: center;
    margin-bottom: 80px;
}

.btns__block.mb0{
    margin-bottom: 0;
}

.btns__block .btns {
    display: flex;
    align-items: center;
    justify-content: center;
}
.btns__block .btns .btn a{
    border: solid 4px #C41815;
    margin-bottom: 0px;
    padding: 20px 45px;
    border-radius: 100px;
    background-color: #C41815;
    display: block;
}
.btns__block .btns img{
    height: 55px;
    display: block;
}

.btns__block .btns .btn a.min img{
    height: 30px;
}

.how_to_step___block{
    max-width: 610px;
    margin: 0px auto;
}

.how_to_step{
    border: solid 4px #C41815;
    border-radius: 15px;
    margin-bottom: 60px;
}
.how_to_step .how_to_step-header{
    position: relative;
    top: -28px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 180px;
    background-color: #C41815;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding:15px 20px;
    box-shadow: 0 0 2px rgba(100, 100, 100, 0.5);
    border: solid 4px #fff;
    overflow: hidden;
}
.how_to_step .how_to_step-header h3{
    padding: 0px;
    margin: 0px;
    background-color: transparent;
    vertical-align: top;
    line-height: 1em;
}
.how_to_step .how_to_step-header h3 img{
    height: 20px;
    display: block;
}
.how_to_step .how_to_step-body{
    margin-top: -40px;
}
.how_to_step .how_to_step-body img{
    height: 350px;
    display: block;
    margin: 0px auto;
}

.goal.how_to_step .how_to_step-header{
    background-color: #deb46d;
}

.goal.how_to_step{
    border: solid 4px #deb46d;
    border-radius: 15px;
    margin-bottom: 60px;
}

.sarani.how_to_step{
    margin-top: 80px;
}

.sarani.how_to_step .how_to_step-header{
    border-radius: 0px;
    background-color: transparent;
    padding: 0px;
    border: none;
    box-shadow: none;
}
.sarani.how_to_step .how_to_step-header {
    top: -60px;
}
.sarani.how_to_step .how_to_step-header h3 img{
    height: 120px;
}
.sarani.how_to_step .how_to_step-body{
    margin-top: -70px;
}
.sarani.how_to_step .how_to_step-body img{
    height: 350px;
    display: block;
    margin: 0px auto;
}

@media (max-width: 768px) {
    #main .pc {
        display: none;
    }

    #main .sp {
        display: block;
    }

    #main .sub_title__block h2 {
        margin-left: -5px;
        margin-right: -5px;
        width: calc(100% + 10px);
    }

    .h_boader .entry-content .sub_title__block h2 {
        margin-left: -5px;
        margin-right: -5px;
        width: calc(100% + 10px);
    }

    .h_boader .entry-content .sub_title__block h2 .pc {
        display: none;
    }

    .h_boader .entry-content .sub_title__block h2 .sp {
        display: block;
    }

    #hoshino_template i.santa {
        display: block;
        max-width: 75px;
        height: auto;
        position: absolute;
        right: -15px;
        bottom: -40px;
    }

    #hoshino_template i.santa img {
        width: 100%;
    }

    .entry-content img {
        margin: 0 0 10px 0;
        max-width: 100%;
        height: auto;
    }

    .intro {
        padding: 20px 20px;
        margin-bottom: 60px;
    }

    .intro p:last-child {
        margin-bottom: 0;
    }

    .list__block p {
        font-size: 16px;
    }

    .entry-read {
        max-width: 600px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .entry-read p {
        font-size: 0.875rem;
        font-weight: bold;
        text-align: center;
    }

    .list-items {
        display: flex;
        flex-wrap: wrap;
        margin-left: -10px;
        margin-right: -10px;
        width: calc(100% + 20px);
    }

    .list-item {
        width: calc((100% - 20px*1)/1);
        margin-left: 10px;
        margin-right: 10px;
        margin-bottom: 30px;
    }

    .entry-content table.p-teble {
        max-width: 840px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px;
    }

    .p-teble tr th {
        display: block;
        text-align: left;
        font-size: 15px;
    }

    .p-teble tr th br {
        display: none;
    }

    .p-teble tr td {
        display: block;
        text-align: left;
        font-size: 15px;
    }

    .p-teble tr td small {
        display: inline-block;
        font-size: 12px;
        line-height: 1.5em;
    }

    .pp_text_area {
        padding: 20px 20px;
        margin-bottom: 20px;
    }
}

@media only screen and (max-width: 560px) {
    .entry-ancher {
        margin-left: 10px;
        margin-right: 10px;
        margin-bottom: 20px;
    }

    .single .entry-content, .page .entry-content {
        padding: 20px 10px;
        padding-top: 0px;
    }

    .entry-header {
        margin-bottom: 20px;
    }

    .intro,
    .list__block {
        margin-bottom: 40px;
    }


    .entry-ancher ul{
        flex-wrap: wrap;
        flex-direction: column;
    }
    .entry-ancher ul li{
        margin-bottom: 10px;
    }
    .entry-ancher ul li a img{
        height: 22px;
    }
    .sub_title__block h2{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .sub_title__block h2 img{
        margin: 0px auto;
    }

    .list__block .list {
        border: solid 4px #C41815;
        border-radius: 15px;
        margin-left: 15px;
        margin-right: 15px;
        width: calc((100% - 30px* 1) / 1);
        margin-bottom: 50px;
    }
    .list__block .list:last-child{
        margin-bottom: 0px;
    }

    .list__block .list .list-header img{
        margin: 0px;
    }
    .list__block .list .list-body>img{
        height: 200px;
    }
    .can___block{
        margin-left: 10px;
        margin-right: 10px;
        margin-bottom: 50px;
    }

    .how_to_step .how_to_step-header h3 img{
        margin: 0px;
    }
    .how_to_step .how_to_step-body img{
        height: auto;
        width: 100%;
        border-radius: 15px;
    }
    .sarani.how_to_step .how_to_step-body img{
        height: auto;
        width: 100%;
        border-radius: 15px;
    }
    .entry-content img{
        margin-bottom: 0px;
    }

    .pp_text_area{
        margin-left: 0px;
        margin-right: 0px;
    }

    .how_to_step{
        margin-bottom: 40px;
    }
    .entry-read{
        padding-bottom: 25px;
    }
    .entry-read:after{
        width: 78px;
        height: 98px;
        position: absolute;
        right: -15px;
        top: 180px;
    }
}

.fix_btns__block {
    position: fixed;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    padding: 10px;
    background-color: rgba(255, 255, 255, 0.5);
}

.fix_btns__block .btns {
    display: flex;
    justify-content: center;
}


.fix_btns__block .btns .btn a{
    border: solid 4px #C41815;
    margin-bottom: 0px;
    padding: 20px 45px;
    border-radius: 100px;
    background-color: #C41815;
    display: block;
}
.fix_btns__block .btns .btn a img {
    height: auto;
    width: auto;
    height: 30px;
}

.footer #inner-footer {
    padding-bottom: 100px;
}

@media only screen and (max-width: 560px) {
    .fix_btns__block{
        bottom: 62px;
    }
    .fix_btns__block .btns .btn a{
        border: solid 4px #C41815;
        margin-bottom: 0px;
        padding: 10px 45px;
        border-radius: 100px;
        background-color: #C41815;
        display: block;
    }
    .fix_btns__block .btns .btn a img {
        width: auto;
        height: 26px;
    }
}