/* ============================================================
   audition.css
   audition ページ専用スタイル
   (このページ固有のスタイルはここに追加してください)
============================================================ */

/*----------変数の定義------------*/

:root {
   --theme: #ff7e7e;
   --red: #984D4A;
   --light_pink: #fbaaca;
   --yellow: #fee950;
   --blue: #73a1d5;
   --black: #1b1b1b;
}

/*-------------------------------*/

html {
   scroll-behavior: smooth;
}

h2 {
   font-family: "Racing Sans One";
   font-size: 36px;
   line-height: 45px;
   text-align: center;
}

.rbtn {
   display: none;
}

p {
   color: var(--black);
   line-height: 1.5;
   text-align: center;
}

ul {
   list-style-position: inside;
}

li {
   line-height: 1.4;
}

a {
   color: var(--black);
}

.footnote {
   display: block;
   font-size: 16px;
   font-weight: 400;
   color: #fff;
}

a.link_pink {
   color: var(--theme);
   text-decoration: underline;
   font-weight: bold;
}

a.link_pink:hover {
   text-decoration: none;
}

.container {
   width: 960px;
   margin: auto;
   padding: 20px 0px;
}

.italic {
   font-style: italic;
}

/*------------------------------------------------*/
/*
/*   ボタン
/*
/*------------------------------------------------*/

.common-btn {
   display: block;
   margin: auto;
   height: 70px;
   text-align: center;
   cursor: pointer;
   filter: drop-shadow(4px 4px 0px rgba(0, 0, 0, 1));
   font-size: 34px;
   transition: 0.1s;
   display: flex;
   justify-content: center;
   align-items: center;
   background-image: url(../../../img/award-opening/sma25/icon_arrow.svg);
   background-repeat: no-repeat;
   background-position: 96% center;
}

.common-btn:hover {
   transform: translate(4px, 4px);
   filter: drop-shadow(0px 0px 0px rgba(0, 0, 0, 1));
   transition: 0.1s;
   color: #fff;
   text-decoration: none;
}

.last_rounds_link {
   height: 200px;
   display: flex;
   align-items: center;
   background: url(../../../img/award-opening/sma25/background_paper.jpg);
   background-position: center bottom;
   background-size: cover;
}

.last_rounds {
   width: 500px;
   font-size: 24px;
   height: 50px;
   color: #fff;
   border-radius: 50px;
   border: solid 3px #1b1b1b;
   margin-bottom: 30px;
}

.last_rounds_link .how_to_join {
   width: 500px;
   font-size: 24px;
   height: 50px;
}

.enter_audition,
.how_to_join, .cta-button--result,
.cta-button--rules {
   background-color: #984D4A;
   color: #fff;
   border-radius: 70px;
   border: solid 3px #1b1b1b;
   height: 50px;
}

.artists-village {
   background-color: #fdfdfd;
   color: #2b2b2b;
   text-decoration: none;
}

.btn_readhere {
   display: inline-block;
   background-color: var(--theme);
   padding: 8px 12px;
   margin: 8px 0;
}

/*------------------------------------------------*/
/*
/*   ホバーアニメーション
/*
/*------------------------------------------------*/

.readhere_wrapper {
   position: relative;
}

.readhere_wrapper img {
   width: 100%;
}

.multiply {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   mix-blend-mode: multiply;
   background: rgba(0, 0, 0, 0.3);
}

.hover_area {
   position: absolute;
   opacity: 0;
   transition: 0.2s;
   height: 100%;
   width: 100%;
   top: 0;
   z-index: 1;
   cursor: pointer;
}

.hover_area:hover {
   opacity: 1;
}

/*------------------------------------------------*/
/*
/*   About SMA
/*
/*------------------------------------------------*/

.about_sma {
   background-image: url(../../../img/award-opening/sma25/bgimg_paper_top.png), url(../../../img/award-opening/sma25/bgimg_paper_bottom.png), url(../../../img/award-opening/sma25/bgimg_top.jpg);
   background-position: top, bottom, center;
   background-repeat: no-repeat, no-repeat, no-repeat;
   background-size: 100%, 100%, cover;
   padding: 130px 0 130px;
}


.about_sma h2 img {
   margin: auto;
}

.about_sma h3 {
   margin-bottom: 52px;
}

.about_sma h3 img {
   margin: auto;
}

.about_sma p {
   font-size: 18px;
   margin-bottom: 26px;
   color: var(--black);
}

.about_sma .themes_mov {
   margin-bottom: 60px;
}

.about_sma .judges_article {
   display: flex;
   gap: 16px;
   background-color: #fff;
   margin: 4px 4px 40px;
}

.about_sma .text-section {
   width: 70%;
   font-size: 16px;
   padding: 10px 16px 10px 0;
}

.about_sma .judge-section {
   background-color: var(--black);
   width: 30%;
   display: flex;
   flex-direction: column;
}

.about_sma .judge-caption {
   color: #fff;
   width: 100%;
   text-align: center;
   padding: 4px 0;
   font-size: 16px;
}

.swiper-pagination-bullet {
   width: 12px;
   height: 12px;
   background: #d9d9d9;
   opacity: 1;
}

.swiper-pagination-bullet-active {
   opacity: 1;
   background: #984D4A;
}

/*----------------------------------*/
/*About Theme
/*----------------------------------*/

.about_theme {
   padding: 0 0 40px;
   background-image: url(../../../img/award-opening/sma25/background_paper.jpg);
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
}

.about_theme a {
   text-decoration: underline;
}

.about_theme h2 img {
   margin: auto;
}

.about_theme p {
   font-size: 18px;
   color: var(--black);
}

.about_theme ul {
   color: var(--black);
   font-size: 24px;
   font-weight: 500;
   text-align: center;
   padding: 18px 0;
}

.about_theme .theme_container {
   margin-bottom: 40px;
}

.about_theme .theme_container img {
   margin: auto;
}

.theme_img_container {
   display: flex;
   justify-content: space-between;
   margin-top: 36px;
}

.theme_img_item {
   width: 30%;
   border: 1px solid var(--black);
}

.work_description {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 90%;
   text-align: center;
}

.work_description p,
.work_description a {
   color: #fff;
}

.work_description a {
   text-decoration: underline;
}

.work_description .work_award {
   font-size: 12px;
}

.work_description .work_award span {
   display: block;
}

/*----------------------------------*/
/* Submittion Process
/*----------------------------------*/

.submission {
   background-image: url(../../../img/award-opening/sma25/bgimg_paper_top.png), url(../../../img/award-opening/sma25/bgimg_paper_bottom.png), url(../../../img/award-opening/sma25/bgimg_top.jpg);
   background-position: top, bottom, center;
   background-repeat: no-repeat, no-repeat, no-repeat;
   background-size: 100%, 100%, cover;
   padding: 9rem 0 7rem;
   display: flex;
   align-items: center;
}

.submission h2 img {
   margin: auto;
}

.submission_container {
   display: grid;
   grid-template-columns: 1fr 2fr;
   grid-template-rows: repeat(3, 1fr);
   grid-column-gap: 0px;
   grid-row-gap: 0px;
   align-items: center;
   gap: 50px 36px;
   position: relative;
}

.submission_container::before {
   content: "";
   display: inline-block;
   width: 2px;
   height: 80%;
   background-color: var(--red);
   position: absolute;
   top: 50%;
   left: 16%;
   transform: translateY(-50%);
   z-index: 0;
}

.dot_s {
   grid-area: 1 / 1 / 2 / 2;
}

.dot_m {
   grid-area: 2 / 1 / 3 / 2;
}

.dot_l {
   grid-area: 3 / 1 / 4 / 2;
}

.submission_date {
   grid-area: 1 / 2 / 2 / 3;
}

.judging_date {
   grid-area: 2 / 2 / 3 / 3;
}

.result_date {
   grid-area: 3 / 2 / 4 / 3;
}

.dot {
   text-align: center;
   margin: auto;
}

.submission_title {
   font-size: 24px;
   font-weight: 600;
   margin-bottom: 10px;
}

.date_container {
   font-weight: 700;
   font-size: 28px;
   display: flex;
   gap: 0;
}

.date_container .year {
   border: 1px solid #490000;
   border-radius: 12px;
   font-size: 20px;
   padding: 2px 8px;
   margin: 0 12px;
}

.date_arrow {
   width: 10%;
   display: flex;
   justify-content: center;
   align-items: center;
}

.bgimg_penmaru_line img {
   width: 100vw;
}

/*----------------------------------*/
/*Submission method
/*----------------------------------*/
.submission_method {
   background-image: url(../../../img/award-opening/sma25/background_paper.jpg);
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   padding: 1px 0;
}

.submission_method .container {
   border: solid 10px var(--red);
   margin: 2rem auto;
   padding: 2rem;
   display: flex;
   flex-direction: column;
   gap: 2rem;
}

.submission_method h2 {
   display: flex;
   justify-content: center;
   margin: 0;
}

.submission_method h3 {
   margin: 0;
}

.submission_method p {
   font-size: 18px;
}

.submission_method ul {
   list-style: inside;
   list-style-type: disc;
   display: flex;
   flex-direction: column;
   gap: 0.6rem;
}

.submission_method .submission_instructions,
.submission_method .after_submission,
.submission_method .submission_form {
   display: flex;
   flex-direction: column;
   gap: 0.8rem;
}

.submission_method .submission_instructions {
   background-color: #fff;
   padding: 1rem;
   border: solid 1px #d0d0d0;
}


/*----------------------------------*/
/*Enter SMA for Exciting Opportunities
/*----------------------------------*/

.opportunities {
   background-image: url(../../../img/award-opening/sma25/bgimg_paper_top.png), url(../../../img/award-opening/sma25/bgimg_top.jpg);
   background-position: top, center;
   background-repeat: no-repeat, no-repeat;
   background-size: 100%, cover;
   padding: 80px;
}

.opportunities .container {}

.opportunities h2 img {
   margin: auto;
}

.opportunities_container {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: 30px;
   margin-bottom: 60px;
}

.opportunity {
   width: 30%;
}

.opportunity img {
   margin: auto;

}


.into_anime {
   display: flex;
   justify-content: center;
   flex-direction: column;
   align-items: center;
   width: 50%;
   margin: auto;
}

.into_anime a {
   text-decoration: underline;
   color: #fff;
}

/*----------------------------------*/
/* Artists Village
/*----------------------------------*/

.o96k {
   background: url(../../../img/award-opening/sma25/bgimg_096k.jpg), var(--black);
   background-repeat: no-repeat;
   background-position: bottom;
   background-size: contain;
   position: relative;
   aspect-ratio: 4/3;
}

.o96k .container {
   padding: 0 0 10px;
   height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}

.o96k_container_top p {
   color: #fdfdfd;
}

.o96k_container_top h2 {
   color: #fdfdfd;
   font-size: 32px;
   margin-bottom: 0px;
   line-height: 1.5;
}

.o96k_container_top a {
   color: #fdfdfd;
   text-decoration: underline;
}

.o96k_container_bottom {
   display: flex;
   justify-content: space-around;
   align-items: center;
}

.to-one-shot_btn {
   width: 24%;
}

.to-o96k_btn {
   width: 600px;
}

.to-o96k_btn .common-btn:hover {
   color: inherit
}

.mcpush_container {
   display: flex;
   background-color: #000;
   padding: 2px;
}

/*----------------------------------------*/
/*----------------------------------------*/

/*  Works Produced in the Artists Village  */

/*----------------------------------------*/
/*----------------------------------------*/

.published_works {
   background-color: #eff4ff;
   background-image: url(../../../img/award-opening/sma25/bgimg_works_b.jpg);
   background-size: auto;
   background-repeat: repeat-x;
   padding-bottom: 90px;
   background-position: bottom;
}

.published_works h2 {
   font-family: "Racing Sans One", cursive;
   text-align: center;
}

.published_works h3 {
   text-align: left;
   margin-bottom: 0;
   margin-top: 30px;
}

p.manga_title {
   text-align: center;
   width: 100%;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

p.creator_name {
   color: #969696;
   text-align: center;
   width: 100%;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.manga a {
   text-decoration: none;
}

.manga a:hover {
   color: inherit;
}

.manga_des_container {
   padding: 6px 10px;
}

.series_works .swiper-slide,
.one-shot_works .swiper-slide {
   background: #fff;
   border-radius: 8px;
   box-shadow: 0 0 4px 4px rgba(0, 0, 0, 0.08);
   transition: 0.2s;
   overflow: hidden;
}

.series_works .swiper-slide:hover,
.one-shot_works .swiper-slide:hover {
   box-shadow: 0 0 4px 4px rgba(0, 0, 0, 0.2);
}

.published_works .swiper.swiper-container_d {
   padding: 10px 0;
}

/* デフォルトのSVG矢印を消す */
.published_works .swiper-button-prev svg,
.published_works .swiper-button-next svg {
   display: none;
}

.published_works .swiper-button-prev::after,
.published_works .swiper-button-next::after {
   background-repeat: no-repeat;
   background-size: contain;
   content: "";
   height: 42px;
   margin: auto;
   width: 26px;
}

/* 前への矢印カスタマイズ */
.published_works .swiper-button-prev:after {
   background-image: url(../../../img/award-opening/sma25/icon_slide_toleft.png);
}

/* 次への矢印カスタマイズ */
.published_works .swiper-button-next::after {
   background-image: url(../../../img/award-opening/sma25/icon_slide_toright.png);
}

/*----------------------------------*/
/*Rules
/*----------------------------------*/

.rules {
   padding: 60px 0 90px;
}

.rules h3 img {
   margin: auto;
}

.rules ul {
   list-style: inside;
}

.award-section {
   display: flex;
   justify-content: center;
   gap: 30px;
   align-items: center;
   border-top: solid 2px var(--black);
   padding: 30px 0 0;
   width: 86%;
}

.award-icon {
   width: 20%;
}

.award-details {
   width: 60%;
   text-align: center;
}

.award-details img {
   margin: auto;
}

.rules_prizes {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 30px;
   border: 10px solid var(--red);
   background-image: url(../../../img/award-opening/sma25/bgimg_hougan.jpg);
   padding: 40px 0;
   margin-bottom: 80px;
}

.ex_prize p::before {
   content: url(../../../img/award-opening/sma25/img_leaf_left.png);
}

.ex_prize p::after {
   content: url(../../../img/award-opening/sma25/img_leaf_right.png);
}

.ex_prize h4 {
   font-size: 24px;
   text-align: center;
   margin-bottom: 0;
}

.ex_prize p {
   font-size: 24px;
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 10%;
}

.rules_participationprizes {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 50px;
   border: 10px solid var(--red);
   background-image: url(../../../img/award-opening/sma25/bgimg_hougan.jpg);
   padding: 40px 0;
   margin-bottom: 80px;
}

.rules_participationprizes h4 {
   font-size: 20px;
   text-align: center;
   margin-bottom: 16px;
}

.participationprizes_article {
   width: 83%;
}

.participationprizes_container {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 30px;
}

.participationprizes_container:first-child {
   margin-bottom: 34px;
}

.participationprizes_text {
   flex-basis: 60%;
}

.participationprizes_img {
   width: 40%;
   background-color: #fff;
   padding: 12px;
   flex-basis: 40%;
}

.participationprizes_img img {
   margin: auto;
}

.youtube_video {
   background-color: #fff8c7;
   margin-top: 18px;
}

.youtube_video .intro {
   padding: 4px;
}

.video-wrapper {
   width: 100%;
   aspect-ratio: 16 / 9;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
}

.video-wrapper iframe {
   width: 100%;
   height: 100%;
}

.video-wrapper button {
   text-align: center;
   display: flex;
   background-color: #fff;
   padding: 1rem;
   margin: 1rem auto;
   border-radius: 0.4rem;
   border: solid 1px #c8c8c8;
}

.embed-consent-notice__text {
   padding: 3rem 0 0;
}

/*----------------------------------*/
/*Judging details and rules
/*----------------------------------*/



#box {
   overflow: hidden;
   max-height: 0;
   transition: max-height 0.3s ease;
}

#box h4 {
   margin-bottom: 0;
}

.rules_detail {
   text-align: left;
   padding: 30px;
   border: 1px solid var(--black);
   background: #fff;
   margin-bottom: 60px;
}

.rules_detail h3 {
   background: var(--red);
   position: relative;
   cursor: pointer;
   transition: all 0.5s ease;
   margin: 0;
   filter: drop-shadow(4px 4px 0px rgba(0, 0, 0, 0.25));
   color: #fff;
   text-align: center;
   padding: 8px;
}

.rules_detail h3:hover {
   transform: translate(4px, 4px);
   filter: drop-shadow(0px 0px 0px rgba(0, 0, 0, 0.25));
   transition: 0.1s;
   color: #fff;
}

.rules_judging {
   border: 3px solid var(--red);
   background-image: url(../../../img/award-opening/sma25/bgimg_hougan.jpg);
   padding: 20px;
   margin-bottom: 40px;
}

.judging_detail_container {
   display: flex;
   justify-content: space-between;
}

p.judging_summary {
   font-size: 18px;
   margin-bottom: 40px;
   text-align: left;
}

.judging_detail {
   width: 30%;
}

.judging_detail h4 {
   font-size: 24px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 4%;
   margin-bottom: 8px;
}

.judging_detail h4::after {
   content: "";
   width: 100%;
   height: 2px;
   background-color: var(--black);
}

.judging_detail p {
   text-align: left;
}

.rules_section {
   border: 3px solid var(--red);
   background-image: url(../../../img/award-opening/sma25/bgimg_hougan.jpg);
   padding: 20px;
   margin-bottom: 40px;
}

.rules_container {
   display: flex;
   justify-content: space-between;
   gap: 30px;
}

.rules_section h5 {
   font-size: 18px;
   font-weight: 800;
}

.rules_section h5:not(:first-child) {
   margin-top: 30px;
}

.rules_section h5:after,
.rules_section h5:before {
   content: "*";
}

.rules_detail .link_pink {
   display: block;
   text-align: center;
   margin-top: 22px;
   font-size: 18px;
}

.canvas_size_section {
   border: 3px solid var(--red);
   background-image: url(../../../img/award-opening/sma25/bgimg_hougan.jpg);
   padding: 20px;
   margin-bottom: 40px;
}

.canvas_size_section h5 {
   font-size: 18px;
   font-weight: 800;
}

.judges_section {
   border: 3px solid var(--red);
   background-image: url(../../../img/award-opening/sma25/bgimg_hougan.jpg);
   padding: 20px;
   margin-bottom: 40px;
}

.judges_section a {
   display: block;
   line-height: 1.5;
   font-size: 18px;
}

.submitting_section {
   border: 3px solid var(--red);
   background-image: url(../../../img/award-opening/sma25/bgimg_hougan.jpg);
   padding: 20px;
   margin-bottom: 40px;
}

p.canvas_size_note {
   margin-top: 38px;
}

p.judges_note {
   margin-top: 30px;
   line-height: 1.4;
   font-size: 18px;
   text-align: center;
}

.rules_note {
   margin: 40px 0;
}

/*　　　　　　　　　　　　 　*/
/*  アコーディオンメニュー  */
/*                      */

/*アイコンの＋と×*/
.rules_detail h3::before,
.rules_detail h3::after {
   position: absolute;
   content: "";
   width: 15px;
   height: 2px;
   background-color: #fff;
}

.rules_detail h3::before {
   top: 48%;
   right: 15px;
   transform: rotate(0deg);
}

.rules_detail h3::after {
   top: 48%;
   right: 15px;
   transform: rotate(90deg);
}

/*　close_menuというクラスがついたら形状変化　*/
.rules_detail h3.close_menu::before {
   transform: rotate(45deg);
}

.rules_detail h3.close_menu::after {
   transform: rotate(-45deg);
}


/*----------------------------------*/
/*About Coamix
/*----------------------------------*/
.about_coamix {
   position: relative;
}

.about_coamix a {
   color: #fff;
   text-decoration: underline;
}

.about_coamix a img,
.img_tell_your_friends img {
   margin: auto;
}

.bg {
   position: relative;
   width: 100%;
   height: 900px;
}

.video {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   overflow: hidden;
}

.video video {
   position: absolute;
   top: 50%;
   left: 50%;
   object-fit: cover;
   transform: translate(-50%, -50%);
   width: 100%;
   height: 100%;
}

.overlay {
   position: absolute;
   z-index: 1;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.5);
}

.about_coamix_content {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 2;
   text-align: center;
   color: #fff;
   width: 80%;
}

.about_coamix h3 {
   font-family: "Racing Sans One", cursive;
   color: #fff;
   font-size: 60px;
   line-height: 60px;
   margin-bottom: 26px;
   letter-spacing: 2.4px;
}

p.about_coamix_text {
   margin-bottom: 20px;
   font-weight: 300;
   line-height: 1.4;
   font-size: 22px;
   color: #fff;
}

.tag_your_friends {
   text-align: center;
   padding: 24px 0px;
   background-color: var(--theme);
   background-image: url(../../../img/award-opening/sma25/bgimg_syuchu_left.svg), url(../../../img/award-opening/sma25/bgimg_syuchu_right.svg);
   background-position: left, right;
   background-repeat: no-repeat;
   background-blend-mode: overlay;
   background-size: contain;
}

.tag_your_friends .share-buttons {
   justify-content: center;
}

span.invite_text {
   display: inline-block;
}

.tag_your_friends p {
   margin: 16px 0 30px;
}

.footer-dark .item.text p,
.footer-dark .copyright {
   color: #f0f9ff;
}

/*-----------------------------------*/
/*                                   */
/*           レスポンシブ　            */
/*                                   */
/*-----------------------------------*/

@media screen and (max-width: 1200px) {
   .submission {
      padding: 100px 0 120px;
      background-position: top, bottom, center;
      background-size: 100%, 100%, cover;
   }

   .about_sma {
      padding: 60px 0 90px;
      background-position: top, bottom, center;
      background-size: 100%, 100%, cover;
   }

   .about_theme {
      background-position: center;
      background-size: cover;
   }
}

@media screen and (max-width: 1040px) {
   h2 {
      font-size: 30px;
   }
}

@media screen and (max-width: 1000px) {
   .container {
      width: 90%;
   }

   .o96k_container_top h2 {
      font-size: 24px;
   }

   .about_sma .judges_article {
      flex-direction: column;
      gap: 10px;
   }

   .about_sma .judge-section {
      width: 100%;
   }

   .about_sma .text-section {
      width: 100%;
      padding: 10px 16px;
   }
}

@media screen and (max-width: 960px) {
   .o96k {
      aspect-ratio: 5/4;
   }

   .judging_detail_container {
      flex-direction: column;
      gap: 30px;
   }

   .judging_detail {
      width: 100%;
   }

   .canvas_size_section h4,
   .judges_section h4,
   .submitting_section h4 {
      font-size: 24px;
   }

   p.rules_note {
      text-align: center;
   }

   p.submitting_note {
      text-align: center;
   }

   .rules h3 img {
      width: 90%;
   }

   .about_coamix_content {
      width: 90%;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
   }

   .about_coamix video {
      display: none;
   }

   .about_coamix {
      position: relative;
      background-image: url(../../../img/award-opening/youtube/video_sm.png);
      padding: 42px 0px;
      background-size: cover;
      background-position: center;
      height: 500px;
   }

   .bg {
      position: absolute;
      top: 0;
      z-index: 0;
      height: 100%;
   }

   .about_coamix h3 {
      font-size: 30px;
   }

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

   img.watch_mov {
      right: 0;
      width: 120px;
   }

   .tag_your_friends {
      background-image: url(../../../img/award-opening/sma25/bgimg_syuchu_left_sp.svg), url(../../../img/award-opening/sma25/bgimg_syuchu_right_sp.svg);
   }

   span.invite_text {
      display: inline;
   }
}

@media screen and (max-width: 850px) {
   .theme_img_container {
      flex-direction: column;
      gap: 24px;
   }

   .theme_img_item {
      width: 100%;
   }


   .opportunity {
      flex-basis: 46%;
   }


   .into_anime {
      width: 70%;
   }
}

@media screen and (max-width: 800px) {
   .submission .sma20_container {
      width: 60%;
   }

   .date_container {
      flex-direction: column;
      gap: 15px;
      align-items: center;
   }

   .submission_title {
      text-align: center;
   }

   .submission_container {
      grid-template-columns: 1fr 4fr;
   }

   .submission_container::before {
      height: 75%;
      left: 9%;
   }



   .participationprizes_container {
      flex-direction: column;
   }

   .participationprizes_text {
      width: 100%;
   }

   .participationprizes_img {
      width: 100%;
      background-color: #fff;
      padding: 12px;
   }

   .participationprizes_img {
      margin: 0 0 40px;
   }

   .rules_container {
      flex-direction: column;
   }
}

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

   .last_rounds,
   .how_to_join,
   .enter_audition,
   .artists-village {
      width: 90%;
      font-size: 20px;
      height: 50px;
   }



   .about_sma {
      background-size: 200%, 200%, cover;
   }

   .submission {
      background-size: 290%, 180%, cover;
   }

   .submission .sma20_container {
      width: 80%;
   }

   .participationprizes_text {
      width: 100%;
   }

   .opportunities_container {
      margin-bottom: 60px;
   }

   .opportunities {
      background-size: 180%, cover;
   }

   .o96k {
      background: url(../../../img/award-opening/sma25/bgimg_096k_sp.jpg), var(--black);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      aspect-ratio: 1/2;
   }




}

@media screen and (max-width: 630px) {
   .about_sma {
      padding: 60px 0 80px;
   }

   .submission {
      background-size: 330%, 330%, cover;
      padding: 70px 0;
      display: flex;
      align-items: center;
   }

   .about_theme {
      background-repeat: repeat-y;
   }

   .o96k {
      aspect-ratio: 5/11;
   }

   .o96k_container_bottom {
      flex-direction: column;
      row-gap: 8px;
   }

   .to-one-shot_btn {
      width: 40%;
   }

   .opportunity {
      flex-basis: 100%;
   }

   .award-section {
      flex-direction: column;
   }

   .award-icon {
      width: 40%;
   }

   .award-details {
      width: 90%;
   }

   .rules_detail {
      padding: 20px 14px;
   }
}

@media screen and (max-width: 500px) {
   .opportunities {
      background-position: top, center;
      background-size: 330%, cover;
      padding: 0px;
   }

   .opportunity {
      flex-basis: 100%;
   }

   .rules_prizes h3,
   .rules_detail h3,
   .rules_specialprize h3,
   .rules_participationprizes h3 {
      font-size: 24px;
   }

   .submission .sma20_container {
      width: 90%;
   }

   .o96k {
      aspect-ratio: 1/2;
   }

   .o96k .container {
      padding: 0 0 20px;
   }

   .to-o96k_btn {
      width: 100%;
   }

   .to-one-shot_btn {
      width: 70%;
      display: flex;
      justify-content: space-between;
   }

   .mcpush_container {
      width: 50%
   }

   .mcpush_hukidashi {
      width: 60%;
   }

   .to-one-shot_btn {
      width: 100%;
      display: flex;
   }

   s .into_anime {
      width: 90%;
   }
}

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


   body h2 {
      font-size: 20px;
   }

   .last_rounds {
      width: 90%;
      font-size: 18px;
   }

   .last_rounds_link .how_to_join {
      width: 90%;
      font-size: 18px;
   }

   .submission_title {
      font-size: 22px;
   }

   .date_container {
      font-size: 26px;
   }

   .date_container .year {
      font-size: 16px;
   }

   .opportunities_container {
      gap: 10px;
   }

   .last_rounds_link {
      height: auto;
      padding: 20px;
   }

   .judging_detail_container {
      flex-direction: column;
      gap: 30px;
   }

   .judging_detail {
      width: 100%;
   }

   .canvas_size_section h4,
   .judges_section h4,
   .submitting_section h4 {
      font-size: 24px;
   }

   p.rules_note {
      text-align: center;
   }

   p.submitting_note {
      text-align: center;
   }

   .o96k {
      aspect-ratio: 5/13;
   }

   .about_coamix_content {
      width: 90%;
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
   }

   .about_coamix video {
      display: none;
   }

   .about_coamix {
      position: relative;
      background-image: url(../../../img/award-opening/sma18/youtube/video_sm.png);
      padding: 42px 0px;
      background-size: cover;
      background-position: center;
      height: 500px;
   }

   .bg {
      position: absolute;
      top: 0;
      z-index: 0;
      height: 100%;
   }

   .about_coamix h3 {
      font-size: 30px;
   }

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

   img.watch_mov {
      right: 0;
      width: 120px;
   }

   .tag_your_friends {
      background-image: url(../../../img/award-opening/sma25/bgimg_syuchu_left_sp.svg), url(../../../img/award-opening/sma25/bgimg_syuchu_right_sp.svg);
   }

   span.invite_text {
      display: inline;
   }
}

@media screen and (max-width: 400px) {
   .last_rounds {
      width: 100%;
      font-size: 16px;
   }

   .rules_prizes h3,
   .rules_detail h3,
   .rules_specialprize h3,
   .rules_participationprizes h3 {
      font-size: 20px;
   }

   .submission_title {
      font-size: 18px;
   }

   .date_container {
      font-size: 22px;
   }

   .opportunity {
      flex-basis: 100%;
   }
}