/* 導線ボタンの装飾等設定　→の削除と、今後色を変更する場合の為 */

.button_sample_request{
  display: inline-block;
  margin: auto 0 auto auto;
  padding: 8px;
  font-size: 15px;
  font-weight: 500;
  line-height: 20px;
  color: #212121;
  letter-spacing: .02em;
  text-align: center;
  background-color: #f5ebec;
  position: relative;
  z-index: 2;
}

.button_sample_request::before{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  content: '';
  background-color:rgba(255,255,255,0.7);
  transform-origin: right top;
  transform: scale(0, 1);
  transition: transform .0s;
}

.button_sample_request::after{
  content: " ";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  position:absolute;
  top:0;
  bottom:0;
  right:20px;
  margin:auto;

  }

  .button_sample_request:hover{
    text-decoration:none;
  }

  .button_sample_request:hover::before {
    transform-origin: left top;
    transform: scale(1, 1);
  }

  /* →ありタイプの調整 */
  
  .linkbt_block .bottan_box.bottan3 {
    width:32%;
    
    display: block;
    margin:0 0 0 1%;
    padding: .5em 0 .5em .5em;
    font-size:15px;
    font-weight:500;
    line-height:20px;
    color:#212121;
    letter-spacing: .02em;
    text-align: left;
    background-color:#f5ebec;
    position:relative;
    z-index:2;
  }

  .linkbt_block .bottan_box.bottan3::after{
    content: " ";
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url(../images/link_arrow_red.svg);
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
    position:absolute;
    top:0;
    bottom:0;
    right:20px;
    margin:auto;
  }

  .linkbt_block .bottan_box.bottan3.bottan3long::after{
    right: 5px;
  }
  
  .linkbt_block .bottan_box.bottan3:hover {
    text-decoration:none;
  }
  
  
  .linkbt_block .bottan_box.bottan3::before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    content: '';
    background-color:rgba(255,255,255,0.7);
    transform-origin: right top;
    transform: scale(0, 1);
    transition: transform .0s;
  }

  .linkbt_block .bottan_box.bottan3:hover::before {
    transform-origin: left top;
    transform: scale(1, 1);
  }

  .linkbt_block .bottan_box.bottan3.onebottan{
    padding-right: 35px;
    width: auto;
  }
  .linkbt_block .bottan_box.bottan3.onebottan::after{
    right: .5em;
  }

 /* 海外サイトサンプル請求ボタン（白→赤） */

 .linkbt_block .bottan_box.bottan4 {
  width:32%;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size:15px;
  font-weight:500;
  line-height:20px;
  color:#e6002d;
  letter-spacing: .02em;
  text-align: center;
  text-decoration:none;
  background-color:#ffffff;
  transition: all .3s;
  position:relative;
  z-index:2;
  border: solid 2px #e6002d;
  border-radius: 10px;
}
.linkbt_block .bottan_box.bottan4:hover {
  color:rgb(255, 255, 255);
  background-color:#e6002d;
}

 /* 海外サイトサンプル請求ボタン（赤→白） */

 .linkbt_block .bottan_box.bottan5 {
  width:32%;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size:15px;
  font-weight:500;
  line-height:20px;
  color:#ffffff;
  letter-spacing: .02em;
  text-align: center;
  text-decoration: none;
  background-color:#e6002d;
  transition: all .3s;
  position:relative;
  z-index:2;
  border: solid 2px #e6002d;
  border-radius: 10px;
}
.linkbt_block .bottan_box.bottan5:hover {
  color:#e6002d;
  background-color:#ffffff;
}


 /* 海外サイトサンプル請求ボタン（青→白） */

 .linkbt_block .bottan_box.bottan5_blue {
  width:32%;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size:15px;
  font-weight:500;
  line-height:20px;
  color:#ffffff;
  letter-spacing: .02em;
  text-align: center;
  text-decoration: none;
  background-color:#0089d0;
  transition: all .3s;
  position:relative;
  z-index:2;
  border: solid 2px #0089d0;
  border-radius: 10px;
}
.linkbt_block .bottan_box.bottan5_blue:hover {
  color:#0089d0;
  background-color:#ffffff;
}

/* 海外サイトサンプル請求ボタン（オレンジ→白） */

.linkbt_block .bottan_box.bottan5_or {
  width:32%;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size:15px;
  font-weight:500;
  line-height:20px;
  color:#ffffff;
  letter-spacing: .02em;
  text-align: center;
  text-decoration: none;
  background-color:#F7931E;
  transition: all .3s;
  position:relative;
  z-index:2;
  border: solid 2px #F7931E;
  border-radius: 10px;
}
.linkbt_block .bottan_box.bottan5_or:hover {
  color:#F7931E;
  background-color:#ffffff;
}

 /* 海外サイトサンプル請求ボタン（緑→白） */

 .linkbt_block .bottan_box.bottan5_gr {
  width:32%;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size:15px;
  font-weight:500;
  line-height:20px;
  color:#ffffff;
  letter-spacing: .02em;
  text-align: center;
  text-decoration: none;
  background-color:#009944;
  transition: all .3s;
  position:relative;
  z-index:2;
  border: solid 2px #009944;
  border-radius: 10px;
}
.linkbt_block .bottan_box.bottan5_gr:hover {
  color:#009944;
  background-color:#ffffff;
}

   /*三角矢印付き　色変更ホバーボタン（黒→白）　*/
   .bottan_triangular_arrow_b {
    position: relative;
    margin:auto 2em auto auto;
    display: inline-block;
    padding: .9em 4em;
    background-color: #333;
    border: 2px solid #333;
    color: #fff;
    text-align: center;
    text-decoration: none;
    transition: all .3s;
  }
  .bottan_triangular_arrow_b::after {
    position: absolute;
    top: 50%;
    right: .2em;
    content: '';
    margin-top: -5px;
    border: 7px solid transparent;
    border-top-width: 5px;
    border-bottom-width: 5px;
    border-left-color: #fff;
    transition: all .3s;
  }
  .bottan_triangular_arrow_b:hover {
    background-color: #fff;
    color: #333;
    text-decoration:none;
  }
  .bottan_triangular_arrow_b:hover::after {
    border-left-color: #333;
  }

        /* 横並び */

        .center_justify{
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
        }

          /* 横並び(隙間あり) */
          
        .center_justify_sb{
          -webkit-box-pack: space-around;
          -ms-flex-pack: space-around;
          justify-content: space-around;
          -webkit-justify-content: space-around;
         }

        /* 右寄せ */
        .right_justify{
          -webkit-box-pack: flex-end;
          -ms-flex-pack: flex-end;
          justify-content: flex-end;
        }

        /* 縦並び */

        .linkbt_block.direction_column{
          -webkit-flex-direction: column;
          -ms-flex-direction    : column;
          flex-direction        : column;
          width: 100%;
        }

        /* 均等並び */
        .space_around_justify{
          -webkit-box-pack: space-around;
          -ms-flex-pack: space-around;
          justify-content: space-around;
        }


  .linkbt_block .bottan_box.bottan3_column {
    width: 80%;
    margin:0 0 1% 0;
  }


  .linkbt_block .bottan_box.bottan_red{
    background-color:#f2e6e6;
  }


  .linkbt_block .bottan_box.bottan_bule{
    background-color: #f3f1e7;
  }

  .linkbt_block .bottan_box.bottan_yellow{
    background-color: #e7edf1;
  }

  .linkbt_block .bottan_box.bottan_white{
    background-color: #ffffff;
  }

  .linkbt_block .bottan_box.bottan_wakored{
    background-color: #e6002d;
  }


  /* Flex設定 */
  /* 折り返さない設定 */
  .button_flexonly{
    display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
    
  }
  /* 折り返す設定 */
  .button_flex{
  	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
  	flex-wrap: wrap;
  }

  /* width */

  .button_div_width100{
    width: 100%;
  }

  .button_div_width70{
    width: 70%;
  }

  .button_div_width70-sp{
    width: 70%;
  }

  .button_div_width48-sp{
    width: 48%;
  }

  .button_div_width45-sp{
    width: 45%;
  }

  .width-200px_sp-100{
  
    width: 200px;
  }
  
  .width-538px_sp-100{
    width: 538px;
  }

  .button_img_width100 img{
    width: 100%;
  }

  .button_width_auto{
    width: auto;
  }

  /* height */
  .button_img_height250px img{
    height: 250px;
  }

  /* inhibitor/index.htm　重合禁止剤とはの画像と横並びにするため */
  .button_div_width50{
    width: 50%;
  }

  /* product/macromolecule_index.htm 下部サンプル導線ボタン */
  .button_div_width48{
    width: 48%;
  }

  /* whm/radical.htm　画像幅を100%から引いて調整 */
  .button_radical_width{
    width: calc(100% - 220px);
  }


  /* marginn */

    /* margine(位置調整用) */
    .button_center_margin{
      margin: 0 auto;
    } 

    /* margine(余白) */
    .button_margin_t05em_b3em{
      margin: .5em 0 3em;
    }
  
    .button_margin_tb3em{
      margin: 3em 0;
    }

    .button_margin_tb03em{
      margin: .3em 0;
    }

    .button_margin_tb2em{
      margin: 2em 0;
    }

    .button_margin_b1em{
      margin-bottom: 1em;
    }

    .button_margin_tb3em_center{
      margin: 3em auto;
    }
    
    /* 化学名・CAS番号のリスト調整 */
    .chemicalname_ul{
      margin: 0 0 1em 1.3rem;
    }

  /* padding */
  .padding-10{
    padding: 10px;
  }

  .padding-tb20{
    padding: 20px 0;
  }
  
  .padding-tbr10l20{
    padding: 10px 10px 10px 20px;
  }

  /* taxt-align */
  .button_tacenter{
    text-align: center;
  }

  .button_taright{
    text-align: right;
  }

  .button_taileft{
    text-align: left;
  }


  /* ポイント負け用 */
      /* azo/index.htm <h3>のマージン0 */
  #main_contents .main_listdetail_inner h3.button_sample_margin0{
  margin: 0%;
  }

      /* whm/radical.htm 開始剤の説明<p> */
  .radicalbodycopy_area p.button_div_width100{
  width: 100%;
  }

      /* inhibitor/index.htm　高性能重合禁止剤とはの画像と、サンプル導線ボタンを横に並べるため */
  #main_contents .main_detailtransparent_inner #bodycopy_area .button_div_width50 {
  width: 50%;

  }
      /* azo/example.htmのオレフィンへの付加反応内、PのWidth設定を調整（画像の下に長く表示したい） */
      #main_contents .main_detail_inner .example_spec_block .example_specimg2wey_block p.button_div_width100{
        width: 100%;
      }

  /* →ありのボタンのサイズ調整 */
  .linkbt_block .bottan_box.width_50_sp95{
    width: 50%;
  }

  /* →ありのボタンのサイズ調整2 */
  .linkbt_block .bottan_box.width_65_sp95{
    width: 65%;
  }

  /*製品リンク 幅調整したくないもの*/

#main_contents .button_area #detail_link_area {
	margin:0 0 40px 0;
}

#main_contents .button_area #detail_link_area .linkbt_block {
	width:100%;
	margin:0 0 10px 0;
	padding:20px 0;
	border:solid 1px #ccc;
	display:-webkit-box;
	display: -webkit-flex;
	display:-ms-flexbox;
	display: flex;
	-webkit-flex-wrap:nowrap;
	-ms-flex-wrap:nowrap;
	flex-wrap:nowrap;
	justify-content: flex-start;
	align-content: center;
	align-items: center;

}

#main_contents .button_area #detail_link_area .linkbt_block .copy_box {
	display: block;
	font-size:13px;
	font-weight:400;
	line-height:20px;
	color:#212121;
	letter-spacing: .02em;
	text-align:left;
	padding:0 0 0 20px;
}
/* 
#main_contents .button_area #detail_link_area .cdmo_block .copy_box {
	flex-basis:290px;
} */


#main_contents .button_area #detail_link_area .linkbt_block .bottan_box {
	width:190px;
	display: block;
	margin:auto 0 auto auto;
	padding:8px 45px 8px 0;
	font-size:15px;
	font-weight:500;
	line-height:20px;
	color:#212121;
	letter-spacing: .02em;
	text-align:center;
	background-color:#f5ebec;
	position:relative;
	z-index:2;
}

#main_contents .button_area #detail_link_area .linkbt_block .bottan_box + .bottan_box {
	margin:auto 0 auto 5px;
}

#main_contents .button_area #detail_link_area .cataloglinkbt_block .bottan_box {
	width:300px;
}

#main_contents .button_area #detail_link_area .linkbt_block .bottan_prodcut {
	width:265px;
}

#main_contents .button_area #detail_link_area .linkbt_block .bottan_box::after{
	content: " ";
	display: inline-block;
	width: 24px;
	height: 24px;	
	background-image: url(../images/link_arrow_red.svg);
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
	position:absolute;
	top:0;
	bottom:0;
	right:20px;
	margin:auto;
}

#main_contents .button_area #detail_link_area .linkbt_block .bottan_box:hover {
	text-decoration:none;
}


#main_contents .button_area #detail_link_area .linkbt_block .bottan_box::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	content: '';
	background-color:rgba(255,255,255,0.7);
	transform-origin: right top;
	transform: scale(0, 1);
	transition: transform .0s;
}
#main_contents .button_area #detail_link_area .linkbt_block .bottan_box:hover::before {
	transform-origin: left top;
	transform: scale(1, 1);
}

/* カタログダウンロード用のボタン幅設定 */

#main_contents .button_area #detail_link_area .linkbt_block .bottan_box.catalogDL {
	width:230px;
}

/* ボタンが二つある場合、ボタンの大きさを確保するため、親の幅からボタン分を引いた数値をcopy_boxに指定 */

#main_contents .button_area #detail_link_area .linkbt_block .copy_box.button_2{
  width: calc(100% - 420px);
}

/* margin リセット */
#main_contents .main_detail_inner .spec_area.chemical_name{
  margin: 0;
}

/* 画像の大きさ調整 */
#AIBN_V-601_comparison .button_img_width100 img{
  width: 100%;
}

#AIBN_V-601_comparison .button_img_width100-sp img{
  width: 100%;
}


/* フォント設定 */
.button_addtion_font{
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #212121;
  letter-spacing: .02em;
  text-emphasis: left;
}

#AIBN_V-601_comparison h4 {
  font-size: 16px ;
  font-weight: 500;
  letter-spacing: .02em;
}

.button_font_red_bold{
  color: red;
  font-weight: bold;
}

/* border設定 */
.button_border{
  border:solid 1px #ccc;
}

  /* ボタンのレイアウト調整、SPでON */
  .sp_br_on{
    display: none;
  }
/* 親要素いっぱい表示 */
  #contents .button_objectFit_contain{
    width: 100%;
    object-fit: contain;
  }
/* V-70の低温ラジカル付加反応の化学式 */
  #contents .button_img-height90px{
    width: auto;
    height: 90px;
  }

/* レスポンシブ対応 */
@media screen and (max-width:640px){

  /* ボタンのレイアウト調整、SPでON */
    .sp_br_on{
      display: inline;
    }
  /* ボタンを横長にするため、BRのオンオフ用 */
    .sp_br_none{
      display: none;
    }

    /* inhibitor/index.htm　高性能重合禁止剤とはの画像と、サンプル導線ボタンを縦に並べるため */
    #main_contents .main_detailtransparent_inner #bodycopy_area .button_div_width50{
    width: 100%;
  }

  /* width */
    /* product/macromolecule_index.htm 下部サンプル導線ボタン */
    .button_div_width48{
      width: 100%;
    }

  /* 海外サイトサンプル請求ボタン（白→赤） */

  .linkbt_block .bottan_box.bottan4 {
    width:40%;
    height: 50px;
    font-size: 14px;
    font-weight: 400;
  }

   /* 海外サイトサンプル請求ボタン（赤→白） */

   .linkbt_block .bottan_box.bottan5 {
    width:40%;
    height: 50px;
    font-size: 14px;
    font-weight: 400;
  }

  
   /* 海外サイトサンプル請求ボタン（青→白） */

   .linkbt_block .bottan_box.bottan5_blue {
    width:40%;
    height: 50px;
    font-size: 14px;
    font-weight: 400;
  }

   /* 海外サイトサンプル請求ボタン（オレンジ→白） */

  .linkbt_block .bottan_box.bottan5_or {
    width:40%;
    height: 50px;
    font-size: 14px;
    font-weight: 400;
  }

   /* 海外サイトサンプル請求ボタン（緑→白） */

   .linkbt_block .bottan_box.bottan5_gr {
    width:40%;
    height: 50px;
    font-size: 14px;
    font-weight: 400;
   }

   /* inhibitor/index.htm　重合禁止剤とはの画像と横並びにするため */
    .button_div_width50{
      width: 100%;
    }

    .button_div_width70-sp{
      width: 100%;
    }

    .button_div_width48-sp{
      width: 100%;
    }
  
    .button_div_width45-sp{
      width: 100%;
    }

    .button_radical_width{
      width: 100%;
    }

    #main_contents .main_detailtransparent_inner #bodycopy_area .list_bt_block a.button_sp_width100{
      width: 100%;
    }

    #contents img.button_sp_width100{
      width: 100%;
    }

    .button_flex .button_sp_width50{
      width: 100%;
    }

    .width-200px_sp-100{
  
      width: 100%;
    }
    
    .width-538px_sp-100{
      width: 100%;
    }

    .button_sp_width100{
      width: 100%;
    }

  
  /* text-align */
  .button_taright{
    text-align: center;
  }

  .button_sptaright{
    text-align: right;
    display: block;
  }

  .button_sptaleft{
    text-align: left;
  }

  /* flex設定 */
  /* PC時は折り返さなかったが、SPでは折り返す */
  .button_flexonly{
    display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
  	flex-wrap: wrap;
  }
 
  /* whm/radical.htm 画像を上に説明を下にする */
  #main_contents .button_radical_area{
    -webkit-flex-wrap: wrap-reverse;
    -ms-flex-wrap: wrap-reverse;
    flex-wrap: wrap-reverse;
    justify-content: center;

  }

  /* margin調整 */
  .button_margin_tb3em{
    margin: 2em 0;
  }

    /* 化学名・CAS番号のリスト調整 */
    .chemicalname_ul{
      margin: 0 0 1em 2rem;
    }

/*製品リンク 幅調整したくないもの*/

#main_contents .button_area #detail_link_area {
	margin:0 0 40px 0;
}

#main_contents .button_area #detail_link_area .linkbt_block {
	width:100%;
	margin:0 0 10px 0;
	padding:20px 0;
	border:solid 1px #ccc;
	display:-webkit-box;
	display: -webkit-flex;
	display:-ms-flexbox;
	display: flex;
	-webkit-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
	justify-content: flex-start;
	align-content: center;
	align-items: center;

}

#main_contents .button_area #detail_link_area .linkbt_block .copy_box {
	display: block;
	font-size:13px;
	font-weight:400;
	line-height:20px;
	color:#212121;
	letter-spacing: .02em;
	text-align:left;
	padding:0 0 0 20px;
}

#main_contents .button_area #detail_link_area .cdmo_block .copy_box {
	flex-basis:290px;
}


#main_contents .button_area #detail_link_area .linkbt_block .bottan_box ,
#main_contents .button_area #detail_link_area .linkbt_block .bottan_box.catalogDL {
	width:80vw;
	display: block;
	margin:2vw 0 2vw auto;
	padding:8px 45px 8px 0;
	font-size:15px;
	font-weight:500;
	line-height:20px;
	color:#212121;
	letter-spacing: .02em;
	text-align:center;
	background-color:#f5ebec;
	position:relative;
	z-index:2;
}

#main_contents .button_area #detail_link_area .linkbt_block .bottan_box + .bottan_box {
	margin:auto 0 auto auto;
}

#main_contents .button_area #detail_link_area .cataloglinkbt_block .bottan_box {
	width:80vw;
}

#main_contents .button_area #detail_link_area .linkbt_block .bottan_prodcut {
	width:80vw;
}

#main_contents .button_area #detail_link_area .linkbt_block .bottan_box::after{
	content: " ";
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url(../images/link_arrow_red.svg);
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
	position:absolute;
	top:0;
	bottom:0;
	right:20px;
	margin:auto;
}

#main_contents .button_area #detail_link_area .linkbt_block .bottan_box:hover {
	text-decoration:none;
}


#main_contents .button_area #detail_link_area .linkbt_block .bottan_box::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	content: '';
	background-color:rgba(255,255,255,0.7);
	transform-origin: right top;
	transform: scale(0, 1);
	transition: transform .0s;
}

#main_contents .button_area #detail_link_area .linkbt_block .bottan_box:hover::before {
	transform-origin: left top;
	transform: scale(1, 1);
}

/* →あり */

 .linkbt_block.center_justify{
  -webkit-flex-direction: column;
  -ms-flex-direction    : column;
  flex-direction        : column;
  width: 100%;
}

.linkbt_block .bottan_box.bottan3 {
  width: 95%;
  margin:0 0 1%;
  text-align: left;
  padding-left: .5em;
}

/* ポイント負け用　→ありのボタンの幅調整 */
  .linkbt_block .bottan_box.width_50_sp95{
    width: 95%;
  }

    /* →ありのボタンのサイズ調整2 */
  .linkbt_block .bottan_box.width_65_sp95{
    width: 95%;
  }

/* 画像の調整 */
#AIBN_V-601_comparison .button_img_width100-sp img{
  width: 150%;
}

/* SPでは画面いっぱい表示（点数負け） */
#contents .button_objectFit_contain-sp{
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* 表だけスクロールバー表示 */
.button_img_width100-sp{
    overflow: auto;
}



}

