@charset "utf-8";

.main_container {
 overflow: hidden;
}

.mv_img {
 background-image: url(/cms/sp/nikkor_z/lens/nikkor_z_14-24mm_f28_s/img/main_visual.jpg?rev=24021302);
}

/* product
=======================================*/
.product_inner {
 margin-bottom: -10%;
}
.product_img {
 width: 72%;
 margin: 13% -20% 2% -14%;
}

/* technology
=======================================*/
#technology .markerline{
 display: inline;
 background: linear-gradient(transparent 70%, #ffe433 0%);
 padding: 0 2px;
}
#technology h4.ttl_line{
 font-size: 1.8vw;
 font-weight: 300;
 padding: 1.5rem 0 1.5rem 2rem;
 margin: 0 0 1.5rem;
 border-left: 3px solid #8c98ad;
}
#technology .full_size {
 width: 100%;
 margin: 0 auto 8%;
 line-height: 1;
}
#technology .full_size img,
#technology .half_size img{
 display: block;
 width: 100%;
 height: auto;
}
#technology .section_inner .half_column{
 display: flex;
 justify-content: space-between;
 align-content: flex-start;
 width: 100%;
 margin: 0 auto 8%;
}
#technology .half_column > .col,
#technology .half_column > .img_col,
#technology .half_column > .txt_col{
 flex: 0 0 48%;
}
#technology .half_column > .col > p{
 display: inline-block;
 vertical-align: top;
 width: 100%;
 min-height: 4.5em;
 font-size: 1.4vw;
}
#technology .half_column > .col > figure{
 display: block;
 width: 100%;
 margin: 0 0 1.5rem;
}
#technology p.c_txt{
 font-size: 1.58vw;
 margin: 8% 0 4%;
}
#technology figure img{
 display: block;
 width: 100%;
 height: auto;
}
#technology figure figcaption{
 padding: 1em 0;
 font-size: 1.2vw;
}
#technology .notes {
 font-size: 1.15vw;
}
#technology .tech_note {
 width: 100%;
 padding: 3%;
 margin-bottom: 8%;
 box-sizing: border-box;
 background-color: #fffde3;
}
#technology .tech_note h4{
 font-size: 1.8vw;
 font-weight: 350;
 margin: 1% 0 4%;
}
#technology .tech_note h5{
 font-size: 1.5vw;
 font-weight: 350;
 margin: 1em 0 0;
}
#technology .tech_note p.img img{
 display: block;
 width: 100%;
 height: auto;
 margin: 0 auto;
}
#technology .tech_note p.note{
 font-size: 1.3vw;
 line-height: 1.8;
 padding: 1.5em 0;
}
#technology .tech_note .notes{
 margin: 0 0 2em 1.1em;
}
#technology .tech_note .notes li{
 display: block;
 text-indent: -1.1em;
}
#technology .tech_note div.half_img{
 display: flex;
 justify-content: space-between;
 align-content: flex-start;
 margin: 0 auto 3%;
}
#technology .tech_note div.half_img p{
 flex: 0 0 48.5%;
 line-height: 1;
}
#technology .tech_note div.half_img img{
 display: block;
 width: 100%;
 height: auto;
}

#arneo_coat .section_inner figure{
 margin-bottom: 4%;
}
#arneo_coat .section_inner figure figcaption{
 font-size: 1.5vw;
 padding: 1.5em 0;
}

#dust_dripproof .section_inner{
 margin-bottom: 0;
}
#dust_dripproof .img_col img{
 display: block;
 width: 100%;
 height: auto;
}
#dust_dripproof .txt_col h5{
 font-size: 1.5vw;
 font-weight: 350;
 margin: 0 0 1.5em;
}
#dust_dripproof .txt_col p{
 font-size: 1.3vw;
 margin: 0 0 1em;
}
#dust_dripproof .txt_col .notes{
 margin: 4em 0 0;
}

/*********************************************
 Max Width Size 760px *mobile only
*********************************************/
@media only screen and (max-width: 760px) {
 .product_inner {
  margin-bottom: -15%;
  overflow: hidden;
 }
 .product_img {
  width: 65%;
  margin: 7% -25% 0% -15%;
 }

 #technology h4.ttl_line{
  font-size: 4.2vw;
  padding: 0 0 0 1rem;
  border-left: 1px solid #8c98ad;
 }
 #technology .tech_note h4{
  font-size: 4.2vw;
 }
 #technology .tech_note h5{
  font-size: 3.8vw;
  font-weight: 350;
 }
 #technology p.c_txt{
  font-size: 3.6vw;
  line-height: 2;
 }
 #technology .half_column > .col > p,
 #technology .tech_note p.note{
  font-size: 3.6vw;
 }
 #technology .notes {
  font-size: 3vw;
 }
 #technology .half_column{
  flex-direction: column;
 }
 #technology .half_column > .col,
 #technology .half_column > .img_col,
 #technology .half_column > .txt_col{
  flex: 0 0 100%;
  margin-bottom: 5%;
 }
 #technology .tech_note div.half_img{
  flex-direction: column;
 }
 #technology .tech_note div.half_img p{
  margin-bottom: 1em;
 }
 #technology .tech_note div.half_img p + p{
  margin-bottom: 0;
 }

 #arneo_coat .section_inner figure figcaption{
  padding: 1.5em 0;
  font-size: 3.6vw;
 }

 #dust_dripproof .txt_col p{
  font-size: 3.6vw;
 }
 #dust_dripproof .txt_col h5{
  font-size: 3.8vw;
  font-weight: 350;
 }
}

/*********************************************
 Max Width Size 743px *mobile only
*********************************************/
@media only screen and (max-width: 743px) {
 .mv_img {
  background-image: url(/cms/sp/nikkor_z/lens/nikkor_z_14-24mm_f28_s/img/main_visual_sp.jpg?rev=23011801);
 }
}

/*********************************************
 orientation landscape  *mobile only
*********************************************/
@media only screen and (max-width: 743px) and (orientation: landscape) {
 .mv_img {
  background-image: url(/cms/sp/nikkor_z/lens/nikkor_z_14-24mm_f28_s/img/main_visual_sp_ls.jpg?rev=23011801);
 }
}

/*********************************************
 Min Width Size 2000px
*********************************************/
@media only screen and (min-width: 2000px) {
 #technology h4.ttl_line{
  font-size: 3.6rem;
 }
 #technology p.c_txt{
  font-size: 2.4rem;
 }
 #technology .half_column > .col > p{
  font-size: 2.8rem;
 }
 #arneo_coat figure figcaption{
  font-size: 2.4rem;
 }
}
