

.adspecial_type1 {
  position: relative;
  max-width: none !important;
}
.adspecial_type1::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: .2;
 background-color: #D6E6FE;
background-image: radial-gradient( ellipse farthest-corner at 10px 10px , #A3C5F5, #A3C5F5 50%, #D6E6FE 50%);
background-size: 10px 10px;
background-attachment: fixed;
}

.frame_col_left {
  max-width: 840px;
  margin: 0 auto;
  padding:  40px 24px;
  background: #fff;
  box-shadow: 0 0 5px #ccc;
}
footer {margin-top: 0;}


#adspecial_ms_ua_202303.adspecial_type1 .frame_header {
  position: relative;
  height: 500px;
  margin-bottom: 40px;
  background: linear-gradient(to top, rgb(214 230 255 / 0%) 0%, #A3C5F5 100%);
}

/*
#adspecial_ms_ua_202303.adspecial_type1 .frame_header::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 320px;
  bottom: 0;
  left: 0;
  background: url(/extra/ms_ua_202303/media/head_title.png) no-repeat bottom center;
  background-size: contain;
}

#adspecial_ms_ua_202303.adspecial_type1 .frame_header .cloud {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#adspecial_ms_ua_202303.adspecial_type1 .frame_header .cloud img {
  position: absolute;
  bottom: 0;
  left: -200px;
  width: 200px !important;
  max-width: 200px !important;
  opacity: 0;
  animation: move  1s ease 1s forwards;
}

#adspecial_ms_ua_202303.adspecial_type1 .frame_header .cloud img:nth-of-type(2) {
  top: 0;
  bottom: auto;
  left: auto;
  right: -200px;
  animation: move2 1s ease 1.9s forwards;
}
#adspecial_ms_ua_202303.adspecial_type1 .frame_header .cloud img:nth-of-type(3) {
  left: auto;
  right: -200px;
  animation: move3 1s ease 2.7s forwards;
}

@keyframes move {
  0% {opacity: 0; bottom: 0; left: -200px;}
  100% {opacity: 1; bottom: 150px; left: calc(50% - 500px);}
}
@keyframes move2 {
  0% {opacity: 0; top: 0; right: -200px;}
  100% {opacity: 1; top: 50px; right: calc(50% - 480px);}
}
@keyframes move3 {
  0% {opacity: 0; bottom: 0; right: -200px;}
  100% {opacity: 1; bottom: 0; right: calc(50% - 540px);}
}
*/


#adspecial_ms_ua_202303.adspecial_type1 #head_animation {
  position: absolute;
  left:  calc(50% - 1000px);
  bottom: 0;
  width: 2000px;
  height: 500px;
}

#adspecial_ms_ua_202303.adspecial_type1 h1.adspecial {
  position: relative;
  z-index: 5;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  max-width: 1200px;
  height: 100%;
  margin: 0 auto;
  padding: 24px 16px 0;
  font-size: clamp(1rem, 5vw, 2rem);
  text-align: center;
  line-height: 1.3;
  font-feature-settings: "palt" 1;
}
#adspecial_ms_ua_202303.adspecial_type1 h1.adspecial span {
  position: relative;
  display: block;
  font-size: clamp(1rem, 3vw, 1.5rem);
  margin-top: 16px;
}
#adspecial_ms_ua_202303.adspecial_type1 h1.adspecial span::before {
  content: "";
  width: 50px;
  height: 50px;
  position: absolute;
  z-index: -1;
  top: calc(50% - 25px);
  left: calc(50% - 25px);
  background: url(/extra/ms_ua_202303/media/star.svg) no-repeat center center;
  background-size: contain;
  opacity: 0;
  transform: scale(5,5);
  animation: star 1.6s ease 3s 1 forwards;
}

@keyframes star {
  0% {opacity: 0; transform: scale(5,5);}
  100% {opacity: 1; transform: scale(1,1);}
}

#adspecial_ms_ua_202303.adspecial_type1 h2.adspecial {
  position: relative;
  margin-top: 54px;
  padding: 24px 0;
  color: #194767;
  font-size: clamp(1rem,3vw,1.5rem);
  line-height: 1.3;
  border-top: 6px solid #D2DBEB;
}
#adspecial_ms_ua_202303.adspecial_type1 h2.adspecial::before {
  content: "";
  position: absolute;
  top: -45px;
  left: 0;
  display: block;
  width: 130px;
  height: 45px;
  background: url(/extra/ms_ua_202303/media/title_cloud.png) no-repeat bottom left;
}




/*202305 add*/


#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block{
width:100%;
background-color:#f0f0f0;
margin:45px auto 0;
padding:20px;
}

#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block .wp_ttl{
text-align:center;
font-size:20px;
color:#444;
position:relative;
}

#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block .wp_ttl:before{
content:"";
position:absolute;
bottom:-5px;
left:calc(50% - 40px);
width:80px;
height:3px;
background-color:#d5d5d5;
}


#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul{
display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:center;
background:none;
margin:0 auto !important;
}

#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul li{
width:25%;
padding:30px 15px !important;
}

#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul li:before,
#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul li:after{
display:none;
}

#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul li a img{
width:200px;
margin:0 auto;
display:block;
}
#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul li a img:hover{
filter: grayscale(80%);
transition:0.3s;
}

#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul li a span{
font-size:14px;
display:block;
margin:10px auto 0;
}



@media screen and (max-width: 960px) {

#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul{
display:block;
margin:0 auto;
}

#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul li{
width:100%;
height:100%;
}

#adspecial_ms_ua_202303.adspecial_type1 .wp_add_block ul li a span{
text-align:center;
}

}



#adspecial_ms_ua_202303.adspecial_type1 .frame_col_left #block_story p {
  line-height: 1.8em;
}

#adspecial_ms_ua_202303.adspecial_type1 .article_leaf_paging_word {
  font-size: 12px;
  margin: 20px 0px 30px 0;
  text-align: right;
}

#adspecial_ms_ua_202303.adspecial_type1 .frame_col_left #block_story.article_body {
  margin-top: 0;
}

#adspecial_ms_ua_202303.adspecial_type1 .block_sponsored {
  clear: both;
  border: 1px solid #ccc;
  padding: 5px 10px;
  text-align: center;
  background: #fff;
}

@media screen and (max-width: 800px) {
  #adspecial_ms_ua_202303.adspecial_type1,
  #adspecial_ms_ua_202303.adspecial_type1 .frame_col_right_container,
  #adspecial_ms_ua_202303.adspecial_type1 .frame_col_left_container,
  #adspecial_ms_ua_202303.adspecial_type1 .frame_col_left,
  #adspecial_ms_ua_202303.adspecial_type1 .frame_col_right {
    width: auto !important;
    float: none;
  }
  #adspecial_ms_ua_202303.adspecial_type1 .article_body .left,
  #adspecial_ms_ua_202303.adspecial_type1 .article_body .right,
  #adspecial_ms_ua_202303.adspecial_type1 .article_body .center {
    float: none;
    max-width: 100%;
    text-align: center;
  }
  #adspecial_ms_ua_202303.adspecial_type1 img {
    display: block;
    width: auto !important;
    max-width: 100% !important;
    height: auto;
    margin: 0 auto 10px;
  }

  #adspecial_ms_ua_202303.adspecial_type1 .block_right_plink {
    display: none;
  }
}


@media screen and (max-width: 480px) {
  #adspecial_ms_ua_202303.adspecial_type1 .frame_header {
    height: 400px;
  }
  #adspecial_ms_ua_202303.adspecial_type1 #head_animation {
  left:  calc(50% - 500px);
  width: 1000px;
  height: auto;
  }
  #adspecial_ms_ua_202303.adspecial_type1 h1.adspecial span::before {
    animation: star 1.6s ease .5s 1 forwards;
  }
}

