@charset "UTF-8";


*,
*::before,
*::after {
    box-sizing: border-box;
}

/* スマホでは非表示 */
.sp_no {
    display: none;
}


.content {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}




/* -------------------------- */
/* --------main-------- */
/* -------------------------- */
.main {
    background-color: var(--color-red);
    overflow: hidden;
    background-image: url(../img/main-visial_pattern.webp);
    background-repeat: repeat-x;
    background-position: bottom;
    background-size: 10%;
}

.main .main-visial_copy {
    box-sizing: border-box;
    margin: 30px 10% 40px 10%;
    background-image: url(../img/main-visial_copy_sp.svg);
    height: 0;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 50.12%;
    background-position: 0 0;
    background-size: contain;
}

.main h1.title {
    position: relative;
}

.main h1.title .img02 {
    width: 42%;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 1;
    margin: 0 auto;
    bottom: 0;
}



/* -------------------------- */
/* --------about-------- */
/* -------------------------- */
.about {
    background-color: var(--color-beige-right);
    padding: 30px 5%;
    background-image: url(../img/concept_back.webp);
    background-position: left top 15%;
    background-size: 20%;
}

.about .about_copy {
    background-image: url(../img/concept_txt_sp.svg);
    height: 0;
    /* 表示画像の高さ ÷ 表示画像の幅 × 100 */
    padding-top: 44.37%;
    background-position: 0 0;
    background-size: contain;
}



/* -------------------------- */
/* --------info-------- */
/* -------------------------- */
.info {
    margin: 30px 0;
}

.info .info_content {}

.info .info_content dt.itme_t_01,
.info .info_content dt.itme_t_02 {
    font-size: var(--s20);
    padding: 5px 15px;
    border-radius: 5px;
    text-align: center;
    place-content: center;
    margin: 20px 0 5px 0;
}

.info .info_content dt.itme_t_01 {
    background-color: var(--color-green);
    color: var(--color-white);
}

.info .info_content dt.itme_t_02 {
    color: var(--color-green);
    border: 3px solid;
}

.info .info_content dd.itme_tx_01 {
    font-size: var(--s18);
}

.info .info_content dd.itme_tx_01 span {
    font-size: var(--s21);
}

.info .info_content dd.itme_tx_02 {
    font-size: var(--s18);
}


/* -------------------------- */
/* -----------gift SP--------- */
/* -------------------------- */

.gift {
    margin-top: 1.5rem;
    margin-bottom: 3rem;
}


/* 金色の点線枠 */
.gift__frame {
    position: relative;
    padding: 6px;
    border-radius: 1rem;
    background-color: #ffffff;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Crect width='100%25' height='100%25' fill='none' stroke='%23cab168' stroke-width='18' stroke-dasharray='18 45' stroke-linecap='square' rx='20' ry='20'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
}


.gift__inner {
    background: var(--color-green);
    border-radius: .8rem;
    padding: 2rem;
}


/* タイトル */
.gift .gift_copy {
    background-image: url(../img/gift_copy_sp.svg);
    height: 0;
    padding-top: 50%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-bottom: 1.5rem;
}


/* -------幅------- */
.gift__card,
.gift__text,
.gift__button {
    box-sizing: border-box;
    max-width: 100%;
}


/* カード */
.gift__card {
    display: block;
    margin: 0 auto;
}


/* 説明文 */
.gift__text {
    margin: 1rem auto;
    color: var(--color-white);
    text-align: left;
    font-size: var(--s12);
    line-height: 1.5;
}


/* ボタン */
.gift__button {
    text-align: center;
    width: 100%;
    margin: 0 auto;
    padding: 1rem 0.5rem;
    background: var(--color-white);
    border: 3px solid var(--color-beige);
    border-radius: 10px;
    transition: .3s;
}

.gift__button a{
    color: var(--color-green);
    font-size: var(--s22);
    font-weight: 900;
}
.gift__button span {
    color: var(--color-red);
    font-weight: 900;
    display: block;
}

/* -------------------------- */
/* --------work-------- */
/* -------------------------- */

.work {
    background-image: url(../img/content_back_right.webp), url(../img/content_back_left.webp);
    background-position: right top 20%, left top 60%;
    background-size: 15%;
}

.work h3.title {
    background-color: var(--color-red);
    border: 3px solid var(--color-beige);
    border-radius: 10px;
    position: relative;
    text-align: center;
    padding: 7px 10px 3px 10px;
}

.work h3.title .img01 {
    position: absolute;
    width: 15%;
    left: -4%;
    top: -30%;
}

.work h3.title .img02 {
    width: 40%;
}


.work_list {}

.work_list .item {
    padding: 10% 15%;
}

.work_list .item .img {
    text-align: center;
    position: relative;
}

.work_list .item .img::after {
    content: "";
    background-image: url(../img/icon_enlarged.svg);
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    right: 0;
    bottom: 0;
}

.work_list .item .img img {
    outline: 2px solid var(--color-beige);
}

.work_list .item .rank {
    text-align: center;
    margin: 10px;
}

.work_list .item .rank img {
    width: 23%;
}

.work_list .txt{text-indent: 1rem;}
.desc_txt {list-style: none;}

.desc_txt li {
  position: relative;
  padding-left: 1em;
  font-size: var(--s16);
  line-height: var(--s28);
  font-weight: 300;
  margin-top: 0.5rem;

}

.desc_txt li::before {
  content: "・"; /* 表示したいマーク */
  position: absolute;
  left: 0;
  top: 0;
}


/* -------------------------- */
/* --------participant-------- */
/* -------------------------- */
.participant {}

.participant h3.title {
    color: var(--color-beige);
    border: 2.5px solid var(--color-beige);
    text-align: center;
    padding: 7px 10px;
    border-radius: 15px;
    letter-spacing: 0.5rem;
    margin: 30px 0 10px 0;
    font-size: var(--s20);
}

.participant .txt {
    font-size: var(--s16);
    line-height: var(--s24);
}

.participant .txt span {
    display: inline-block;
}




/* -------------------------- */
/* --------apply-------- */
/* -------------------------- */
.apply {
    margin: 30px 0 0 0;
}

.apply .content {
    position: relative;
    padding-bottom: 8%;
}

.apply h4.title {
    text-align: center;
    font-size: var(--s24);
    line-height: var(--s34);
}

.apply h4.title span {
    font-weight: 600;
    color: var(--color-red);
    font-size: var(--s30);
}

.apply_bt {
    display: block;
    background-color: var(--color-green);
    outline: 5px solid var(--color-beige);
    border-radius: 60px;
    text-align: center;
    padding: 20px 3.5rem 20px 0;
    margin: 20px 0 0 0;
    box-shadow: 0 0.8rem 0 rgba(0, 0, 0, 0.5);
}


.apply_bt .img02 {
    width: 58%;
}

.apply_bt .img03 {
    width: 28%;
    right: 0;
    position: absolute;
    bottom: 13%;
}


/* -------------------------- */
/* --------footer-------- */
/* -------------------------- */
footer {
    background-color: var(--color-red);
    color: var(--color-white);
    text-align: center;
    padding:10px 20px;
}

footer .footer_contact{
background-color: #dac89a;
border-radius: 10px;
padding: 20px 20px;
margin: 20px 0;
}
footer .footer_contact .title{
color: var(--color-beige-dark);
}
footer .txt{
font-size: var(--s14);
}

footer .footer_contact .footer_contact_tel,
footer .footer_contact .footer_contact_mail{
margin-top: 20px;
}

footer .footer_contact .footer_contact_tel a,
footer .footer_contact .footer_contact_mail a{
display: inline-block;
background-color: var(--color-beige-dark);
padding: 10px 20px;
color: var(--color-white);
width: 100%;
height: 100%;
border-radius: 10px;
}

footer .footer_contact .footer_contact_mail a span::after{
content: "";
display:inline-block;
background-image: url(../img/icon_link.svg);
width: 13px;
height: 13px;
margin-left: 5px;
}
footer .copyright{display: block;}