/* フレーム設定-------------------------------------------------------------------------------- */
.adspecial_type1 {
max-width: 100% !important;
width: 100%;
}

#adspecial_ibm_1911{
padding: 0;
}

.adspecial_type1 .frame_col_left {
max-width: 980px;
margin: 0 auto;
left: 0;
}


#adspecial_ibm_1911.adspecial_type1 .frame_col_left_container {
	background: #ffffff;
}
#adspecial_ibm_1911.adspecial_type1 .frame_col_right_container {
	background: #ffffff;
}


/* Headline設定-------------------------------------------------------------------------------- */
.adspecial_type1 .frame_header {
position: relative;
	background:#000;

display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
	height:300px;
}
.adspecial_type1 .frame_header::before,
.adspecial_type1 .frame_header::after {
display: block;
content: "";
border-bottom: 1px dashed #35c83f;
position: absolute;
top: 5px;
left: 0;
width: 100%;
height: 1px;
}
.adspecial_type1 .frame_header::after {
top: auto;
bottom: 5px;
left: auto;
right: 0;
height: 36px;
content: "Columns 00001 00072";
padding: 0 100px 5px 0;
text-align: right;
color: #2d9e35;
font-weight: normal;
font-family: impact,verdana,arial,sans-serif;
}
.adspecial_type1 .frame_header p.numbering {
position: absolute;
left: 100px;
bottom: 16px;
color: #2d9e35;
line-height: 1.3;
}




#adspecial_ibm_1911.adspecial_type1 h1.adspecial {
margin:0;
color: #fff;
font-size: 36px;
font-feature-settings: "palt" 1;
z-index: 5;
}

#adspecial_ibm_1911.adspecial_type1 h1.adspecial::before,
#adspecial_ibm_1911.adspecial_type1 h1.adspecial::after {
content: "EDIT IBM . MICROFOCUS . Article. COBOL ( SCGBRSAM )  - 2019 . 11 ";
display: block;
position: absolute;
left: 100px;
top: 24px;
color: #2872b6;
font-size: 18px;
font-weight: normal;
font-family: impact,verdana,arial,sans-serif;
}
#adspecial_ibm_1911.adspecial_type1 h1.adspecial::after {
top: 48px;
content: "Command ===> ";
color: #2d9e35;
}




#adspecial_ibm_1911.adspecial_type1 h1.adspecial span.line2 {display: inline-block; position: relative;}
#adspecial_ibm_1911.adspecial_type1 h1.adspecial span.line2::after {
content: "";
position: absolute;
width: 30px;
height: 2px;
background-color: #fff;
right: -32px;
bottom: 16px;
opacity: 0;
animation: flash 1s 4.8s linear infinite alternate;
}


#adspecial_ibm_1911.adspecial_type1 h1.adspecial small {font-size: 36px; opacity: 0;}
#adspecial_ibm_1911.adspecial_type1 h1.adspecial small:first-of-type {
animation: type 0.2s 0.5s linear forwards;
}

#adspecial_ibm_1911.adspecial_type1 h1.adspecial small:nth-of-type(2) {
animation: type 0.2s 1.0s linear forwards;
}

#adspecial_ibm_1911.adspecial_type1 h1.adspecial small:nth-of-type(3) {
animation: type 0.2s 1.5s linear forwards;
}

#adspecial_ibm_1911.adspecial_type1 h1.adspecial small:nth-of-type(4) {
animation: type 0.2s 2.0s linear forwards;
}

#adspecial_ibm_1911.adspecial_type1 h1.adspecial span.line2 small:nth-of-type(1) {
animation: type 0.2s 2.5s linear forwards;
}

#adspecial_ibm_1911.adspecial_type1 h1.adspecial span.line2 small:nth-of-type(2) {
animation: type 0.2s 3.0s linear forwards;
}

#adspecial_ibm_1911.adspecial_type1 h1.adspecial span.line2 small:nth-of-type(3) {
animation: type 0.2s 3.5s linear forwards;
}

#adspecial_ibm_1911.adspecial_type1 h1.adspecial span.line2 small:nth-of-type(4) {
animation: type 0.2s 4.0s linear forwards;
}

#adspecial_ibm_1911.adspecial_type1 h1.adspecial span.line2 small:nth-of-type(5) {
animation: type 0.2s 4.5s linear forwards;
}

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

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



#adspecial_ibm_1911.adspecial_type1 h2.adspecial {
position: relative;
	background:#000;
margin-top: 24px;
padding: 16px 24px;
clear: both;
color: #2d9e35;
}
#adspecial_ibm_1911.adspecial_type1 h2.adspecial::after {
content: "";
position: absolute;
width: calc(100% - 25em);
height: 1px;
border-bottom: 1px dashed #2d9e35;
top: 50%;
right: 0;
}

#adspecial_ibm_1911.adspecial_type1 .frame_col_left #block_story p, .block-img {
    margin: 1em 96px;
    font-size: 16px;
}

.block-img {clear: both;}
.block-img p {
    margin: 1em 0 !important;
}

.img-xl img {margin-bottom: 16px;}



.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;
    padding: 12px 24px;
    border-radius: 30px;
    background: linear-gradient(to right, #0224CD 0%,#0869FF 100%);
    color: #fff;
    font-size: 140%;
    text-decoration: none;
    transition: 0.5s;
}
.dl-area .btn-area a:hover span {
    margin-right: 15px;
}
.dl-area .btn-area a span {
    position: relative;
    display: inline-block;
    transition: 0.5s;
}
.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 {
    color: #fff !important;
}
.dl-area .btn-area a:hover span::after {
    right: -15px;
    opacity: 1;
}



/* フッタースポンサー枠CSS設定--------------------------------------------------------------------------------*/
#adspecial_ibm_1911.adspecial_type1 .block_sponsored{
	clear: both;
	padding:5px 10px;
text-align: center;
}




/* フッター責任表示--------------------------------------------------------------------------------*/
#adspecial_ibm_1911.adspecial_type1 .block_sponsored address{
	font-weight: normal;
	font-style: normal;
}




/* レスポンシブ --------------------------------------------------------------------------*/
@media screen and (max-width: 960px) {
#adspecial_ibm_1911.adspecial_type1 h1.adspecial::before, #adspecial_ibm_1911.adspecial_type1 h1.adspecial::after,
.adspecial_type1 .frame_header p.numbering {left: 16px;}
.adspecial_type1 .frame_header::after {padding-right: 16px;}
}



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

  #adspecial_ibm_1911.adspecial_type1 .block_right_plink {display: none;}

#block_story {margin-left: 0;}
#adspecial_ibm_1911.adspecial_type1 .frame_col_left #block_story p, .block-img {
    margin: 1em 16px;
    font-size: 16px;
}

.adspecial_type1 .frame_header p.numbering {opacity: 0.5;}
}




@media screen and (max-width: 640px) {
  #adspecial_ibm_1911.adspecial_type1 h1.adspecial,
  #adspecial_ibm_1911.adspecial_type1 h1.adspecial small {font-size: 24px; line-height: 1.3;}
  #adspecial_ibm_1911.adspecial_type1 h1.adspecial span.line2::after {bottom: 0; width: 18px;}
}

@media screen and (max-width: 480px) {
.txt-fade::before {
    height: 30%;
}
.dl-area {padding:30px 16px 56px;}
#adspecial_ibm_1911.adspecial_type1 h1.adspecial {padding: 0 16px;}
  #adspecial_ibm_1911.adspecial_type1 h1.adspecial span.line2::after {display: none;}
#adspecial_ibm_1911.adspecial_type1 h1.adspecial::after {top: 80px;}

}



/* 1column adjust CSS 　以下flat版のみ追記
-----------------------------------------------*/
.adspecial_type1 .frame_col_left{
position:static;
width:970px;
float: none;
}

.adspecial_type1 .frame_col_left_container{
float: none;
position:static;
}

.adspecial_type1 .bottomwp{
	margin: 0 auto;
	text-align: center;
}

#adspecial_ibm_1911.adspecial_type1 h2.adspecial{
	width: auto;
}

.adspecial_type1 .frame_col_left_inner {
	padding: 0;
}

#adspecial_ibm_1911.adspecial_type1 .article_body ul {
	margin:10px 25px;
}