/* フレーム設定-------------------------------------------------------------------------------- */
#adspecial_ibm_202002{
padding: 0;
}

#adspecial_ibm_202002.adspecial_type1 .frame_col_left_container {
	background: #ffffff;
}
#adspecial_ibm_202002.adspecial_type1 .frame_col_right_container {
	background: #ffffff;
}
#contents {padding: 0;}
.adspecial_type1 .frame_col_right_container,
.adspecial_type1 .frame_col_left_container,
.adspecial_type1 .frame_col_left {width: 100% !important; float: none;}
#block_story {margin: 0;}
.adspecial_type1 .frame_col_left_inner {
    padding: 0;
}

/* Headline設定-------------------------------------------------------------------------------- */
.frame_header {
overflow: hidden;
display: flex;
align-items: center;
position: relative;
width: 100%;
height: 400px;
margin: 0 !important;
background: url(/extra/ibm_202002/media/35147879/head_title1.jpg) no-repeat left center;
}


.frame_header::before {
background: linear-gradient(to bottom, rgba(0,0,0,0.9) 0%,rgba(0,0,0,0) 100%); 
content: "";
display: block;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}



.frame_header h1.adspecial {
display: flex;
align-items: center;
height: 100%;
padding: 32px;
position: relative;
font-size: 2rem;
font-weight: bold;
letter-spacing: -0.05em;
line-height: 1.3;
overflow: hidden;
}
.frame_header h1.adspecial strong {
color: #fff;
position: relative;
z-index: 5;
}
.frame_header h1.adspecial strong span {display: block; font-size: 16px; margin-top: 8px; font-weight: normal;}

.frame_header h1.adspecial::before {
content: "";
background: url(/extra/ibm_202002/media/35147879/head_title1.jpg) no-repeat left center; 
display: block;
left: 0;
opacity: 0;
position: absolute;
top: 0;
width: 100%;
height: 100%;
z-index: 4;
filter: blur(4px) grayscale(0.8);
animation: showup 1.2s 0.8s ease-out 1 forwards;
}


@keyframes showup {
0% {opacity: 0;}
100% {opacity: 1;}
}

@media all and (-ms-high-contrast:none){
  #adspecial_ibm_202002.adspecial_type1 h1.adspecial { 
    background: none;
    color: #00ead7;
  } /* IE10以降 */
}

.frame_header2 {background: url(/extra/ibm_202002/media/35147879/head_title2.jpg) no-repeat left center;}
.frame_header2 h1.adspecial::before {background: url(/extra/ibm_202002/media/35147879/head_title2.jpg) no-repeat left center; }


.frame_header3 {background: url(/extra/ibm_201907/media/35139632/bg_head_title.jpg) no-repeat left center;}
.frame_header3 h1.adspecial::before {background: url(/extra/ibm_201907/media/35139632/bg_head_title.jpg) no-repeat left center; }





#adspecial_ibm_202002.adspecial_type1 h2.adspecial {
position: relative;
margin: 40px 96px 24px;
padding: 24px 0;
color: #1F9BE2;
font-size: 24px;
text-align: center;
line-height: 1.3;
background-color: #f5f5f5;
}
#adspecial_ibm_202002.adspecial_type1 h2.adspecial::before {
    content: "";
    height: 3px;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background: linear-gradient(to right, #41D6C3 0%, #0064FF 100%);
}


#adspecial_ibm_202002.adspecial_type1 h3.adspecial {
position: relative;
margin: 24px 96px 18px;
padding-left: 24px;
color: #1F9BE2;
}

#adspecial_ibm_202002.adspecial_type1 h3.adspecial::before {
    content: "";
    width: 8px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(to bottom, #41D6C3 0%, #0064FF 100%);
}


.lead {
margin: 0 0 48px;
padding: 24px 24px 8px; 
color: #fff;
background: #333;
position: relative;
}

.lead::before {
content: "";
background: linear-gradient(to right, #41D6C3 0%, #0064FF 100%);
height: 3px;
left: 0;
position: absolute;
top: 0;
width: 100%;
 }

.lead::before {animation: expand 1.2s 1.2s ease 1 forwards; transform: scale(0,1); transform-origin: left;}
@keyframes expand {
0% {transform: scale(0,1);}
100% {transform: scale(1,1);}
}

.lead p {margin-top: 0 !important;}


.txt-fade {
    position: relative;
}

.txt-fade::before {
    position: absolute;
    bottom: 0;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 10%,rgba(255,255,255,1) 100%);
}


.dl-area {
    position: relative;
    z-index: 10;
    padding: 30px 30px 56px;
    text-align: center;
    background-color: #eee;
}

.btn-area {
    clear: both;
    text-align: center;
}
.dl-area .btn-area a {
    display: inline-block;
    min-width: 320px;
    color: #fff !important;
    text-decoration: none;
    background: linear-gradient(to right, #0064FF 0%,#41D6C3 100%);
    padding: 16px 24px;
    border-radius: 30px;
    transition: 0.5s;
}
.dl-area .btn-area a span {
    position: relative;
    display: inline-block;
    transition: 0.5s;
}
.dl-area .btn-area a:hover span {
    margin-right: 15px;
}
.dl-area .btn-area a span::after {
    position: absolute;
    top: calc(50% - 6px);
    right: -5px;
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(-45deg);
    opacity: 0;
    transition: 0.5s;
}
.dl-area .btn-area a:hover span::after {
    right: -15px;
    opacity: 1;
}

#adspecial_ibm_202002.adspecial_type1 .frame_col_left #block_story p {
  line-height: 1.8em;
  margin: 1em 96px;
}

#adspecial_ibm_202002.adspecial_type1 .block_sponsored {
  margin-top: 48px;
  padding: 16px;
  font-size: 14px;
  font-weight: normal;
  font-style: normal;
   text-align: center;
}

@media screen and (max-width: 800px) {
  #adspecial_ibm_202002.adspecial_type1,
  #adspecial_ibm_202002.adspecial_type1 .frame_col_right_container,
  #adspecial_ibm_202002.adspecial_type1 .frame_col_left_container,
  #adspecial_ibm_202002.adspecial_type1 .frame_col_left,
  #adspecial_ibm_202002.adspecial_type1 .frame_col_right {
    width: auto !important;
    float: none;
  }
  #adspecial_ibm_202002.adspecial_type1 .article_body .left,
  #adspecial_ibm_202002.adspecial_type1 .article_body .right,
  #adspecial_ibm_202002.adspecial_type1 .article_body .center {
    float: none;
    max-width: 100%;
    text-align: center;
  }
  #adspecial_ibm_202002.adspecial_type1 img {
    display: block;
    width: auto !important;
    max-width: 100% !important;
    height: auto;
    margin: 0 auto 10px;
  }

  .frame_header h1.adspecial {
    width: 100%;
    justify-content: center;
    text-align: center;
}
  #adspecial_ibm_202002.adspecial_type1 .frame_col_left #block_story p,
  #adspecial_ibm_202002.adspecial_type1 h2.adspecial,
  #adspecial_ibm_202002.adspecial_type1 h3.adspecial,
  #adspecial_ibm_202002.adspecial_type1 .frame_col_left #block_story p {margin-left: 16px; margin-right: 16px;}
}


@media screen and (max-width: 480px) {
  .frame_header {height: 300px;}
  .frame_header h1.adspecial {font-size: 24px; line-height: 1.3;}
  .frame_header h1.adspecial strong span {margin-top: 8px;}
  #adspecial_ibm_202002.adspecial_type1 h2.adspecial {font-size: 18px; padding-left: 16px; padding-right: 16px;}
  .lead p {margin: 1em 0 !important; font-size: 14px !important;}
  .dl-area .btn-area a {min-width: 0; width: 100%;}
}