@charset "utf-8";

/* --------------------------------------------
  Movie+Lead
-------------------------------------------- */

.top-grad{
background: rgb(195,203,209);
background: linear-gradient(0deg, rgba(195,203,209,1) 0%, rgba(255,255,255,1) 80%, rgba(255,251,251,1) 100%);
margin-bottom: 60px;
}
/*ムービー部分レスポンシブ対応*/
.mov {
  display: block;
  overflow: hidden;
}
.mov iframe{
  display: block;
  overflow: hidden;
  width: 1200px;
  margin: 0 auto;
}


@media print, screen and (max-width: 1219px){
/*ムービー部分レスポンシブ対応*/
.mov {
  position: relative;
  width: 100%;
  padding: calc(686 / 1220 * 100%) 0 0;
}
.mov iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
}

@media print, screen and (max-width: 767px){
.top-grad{
background: rgb(183,193,201);
background: linear-gradient(0deg, rgba(183,193,201,1) 0%, rgba(255,251,251,1) 100%);
margin-bottom: 5px;
}
}

/* -------------------------------------------------
  lead-text
------------------------------------------------- */
.text-lead{
  font-size: 2.0rem;
  padding-bottom: 2em;
}
.text-lead .italic{
  font-size: 2.0rem;
  font-style: italic;
}
@media print, screen and (max-width: 767px){
.text-lead{
  font-size: 1.8rem;
}
.text-lead .italic{
  font-size: 1.8rem;
  font-style: italic;
}
#rwd-content .rwd-product-header .rwd-headline1-type02 {
    padding-right: 0!important;
}
#rwd-content .rwd-product-header .rwd-headline1-type02 {
    padding-bottom: 13px;
}
}

/* -------------------------------------------------
  Photo-Block1
------------------------------------------------- */
.photo-block{
  margin-bottom: 50px;
}
/* IE11表示用のCSS　*/
_:-ms-fullscreen, :root .parent1 {
  display: none;
}
/* IE11表示用のCSS　*/
_:-ms-fullscreen, :root .parent2 {
  display: none;
}
/* IE11表示用のCSS　*/
_:-ms-fullscreen, :root .parent3 {
  display: none;
}
_:-ms-fullscreen, :root .parent4 {
  display: none;
}
/* IE11表示用のCSS　*/
_:-ms-fullscreen, :root .parent5 {
  display: none;
}
/* IE11表示用のCSS　*/
_:-ms-fullscreen, :root .parent6 {
  display: none;
}
/* IE11表示用のCSS　*/
_:-ms-fullscreen, :root .parent7 {
  display: none;
}
.ex-ie11{
  display:  none;
}
/* IE11表示用のCSS　*/
_:-ms-fullscreen, :root .ex-ie11 {
  display: block;
}

.parent1 img,
.parent2 img,
.parent3 img,
.parent4 img,
.parent5 img,
.parent6 img,
.parent6b img,
.parent7 img,
.parent8 img,
.parent9 img,
.parent10 img,
.parent11 img,
.parent12 img,
.parent13 img,
.parent14 img,
.parent15 img{
width:  100%;
overflow: hidden;
}

.parent1{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent1 .photo-1{
  grid-row: 1/3;
  grid-column: 1/3;
}
.parent1 .photo-2{
  grid-row: 1/2;
  grid-column: 3/4;
}
.parent1 .photo-3{
  grid-row: 2/4;
  grid-column: 3/4;
}
.parent1 .photo-4{
  grid-row: 3/4;
  grid-column: 1/2;
}
.parent1 .photo-5{
  grid-row: 3/4;
  grid-column: 2/3;
}

.parent2{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent2 .photo-1{
  grid-row: 1/2;
  grid-column: 1/2;
}
.parent2 .photo-2{
  grid-row: 2/3;
  grid-column: 1/2;
}
.parent2 .photo-3{
  grid-row: 3/4;
  grid-column: 1/3;
}
.parent2 .photo-4{
  grid-row: 1/3;
  grid-column: 2/4;
}
.parent2 .photo-5{
  grid-row: 3/4;
  grid-column: 3/4;
}

.parent3{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent3 .photo-1{
  grid-row: 1/3;
  grid-column: 1/2;
}
.parent3 .photo-2{
  grid-row: 1/3;
  grid-column: 2/3;
}
.parent3 .photo-3{
  grid-row: 1/3;
  grid-column: 3/4;
}
.parent3 .photo-4{
  grid-row: 3/5;
  grid-column: 1/3;
}
.parent3 .photo-5{
  grid-row: 3/4;
  grid-column: 3/4;
}
.parent3 .photo-6{
  grid-row: 4/5;
  grid-column: 3/4;
}
.parent3 .photo-7{
  grid-row: 5/6;
  grid-column: 1/2;
}
.parent3 .photo-8{
  grid-row: 5/6;
  grid-column: 2/3;
}
.parent3 .photo-9{
  grid-row: 5/6;
  grid-column: 3/4;
}
.parent3 .photo-10{
  grid-row: 6/7;
  grid-column: 1/2;
}
.parent3 .photo-11{
  grid-row: 6/7;
  grid-column: 2/4;
}

/*--VOL2--*/

.parent4{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent4 .photo-1{
  grid-row: 1/3;
  grid-column: 1/3;
}
.parent4 .photo-2{
  grid-row: 1/2;
  grid-column: 3/4;
}
.parent4 .photo-3{
  grid-row: 2/3;
  grid-column: 3/4;
}
.parent4 .photo-4{
  grid-row: 3/4;
  grid-column: 1/2;
}
.parent4 .photo-5{
  grid-row: 3/4;
  grid-column: 2/4;
}

.parent5{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent5 .photo-1{
  grid-row: 1/2;
  grid-column: 1/2;
}
.parent5 .photo-2{
  grid-row: 2/4;
  grid-column: 1/2;
}
.parent5 .photo-3{
  grid-row: 1/3;
  grid-column: 2/4;
}
.parent5 .photo-4{
  grid-row: 3/4;
  grid-column: 2/3;
}
.parent5 .photo-5{
  grid-row: 3/4;
  grid-column: 3/4;
}

.parent6{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent6 .photo-1{
  grid-row: 1/3;
  grid-column: 1/2;
}
.parent6 .photo-2{
  grid-row: 1/3;
  grid-column: 2/3;
}
.parent6 .photo-3{
  grid-row: 1/3;
  grid-column: 3/4;
}
.parent6 .photo-4{
  grid-row: 3/5;
  grid-column: 1/3;
}
.parent6 .photo-5{
  grid-row: 3/4;
  grid-column: 3/4;
}
.parent6 .photo-6{
  grid-row: 4/5;
  grid-column: 3/4;
}
.parent6 .photo-7{
  grid-row: 5/6;
  grid-column: 1/2;
}
.parent6 .photo-8{
  grid-row: 6/7;
  grid-column: 1/2;
}
.parent6 .photo-9{
  grid-row: 5/7;
  grid-column: 2/4;
}

/*--VOL4--*/
.parent7{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent7 .photo-1{
  grid-row: 1/2;
  grid-column: 1/2;
}
.parent7 .photo-2{
  grid-row: 2/3;
  grid-column: 1/2;
}
.parent7 .photo-3{
  grid-row: 1/3;
  grid-column: 2/4;
}
.parent7 .photo-4{
  grid-row: 3/4;
  grid-column: 1/3;
}
.parent7 .photo-5{
  grid-row: 3/4;
  grid-column: 3/4;
}

.parent6b{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent6b .photo-1{
  grid-row: 1/3;
  grid-column: 1/2;
}
.parent6b .photo-2{
  grid-row: 1/3;
  grid-column: 2/4;
}
.parent6b .photo-4{
  grid-row: 3/5;
  grid-column: 1/3;
}
.parent6b .photo-5{
  grid-row: 3/4;
  grid-column: 3/4;
}
.parent6b .photo-6{
  grid-row: 4/5;
  grid-column: 3/4;
}
.parent6b .photo-7{
  grid-row: 5/6;
  grid-column: 1/2;
}
.parent6b .photo-8{
  grid-row: 6/7;
  grid-column: 1/2;
}
.parent6b .photo-9{
  grid-row: 5/7;
  grid-column: 2/4;
}

/*
*/
.parent8{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent8 .photo-1{
  grid-row: 1/3;
  grid-column: 1/3;
}
.parent8 .photo-2{
  grid-row: 1/2;
  grid-column: 3/4;
}
.parent8 .photo-3{
  grid-row: 2/3;
  grid-column: 3/4;
}
.parent8 .photo-4{
  grid-row: 3/5;
  grid-column: 1/2;
}
.parent8 .photo-5{
  grid-row: 3/5;
  grid-column: 2/3;
}
.parent8 .photo-6{
  grid-row: 3/5;
  grid-column: 3/4;
}
.parent8 .photo-7{
  grid-row: 5/6;
  grid-column: 1/2;
}
.parent8 .photo-8{
  grid-row: 5/6;
  grid-column: 2/4;
}
.parent8 .photo-9{
  grid-row: 6/7;
  grid-column: 1/2;
}
.parent8 .photo-10{
  grid-row: 6/7;
  grid-column: 2/3;
}
.parent8 .photo-11{
  grid-row: 6/7;
  grid-column: 3/4;
}

/*
*/
.parent9{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent9 .photo-1{
  grid-row: 1/2;
  grid-column: 1/2;
}
.parent9 .photo-2{
  grid-row: 1/2;
  grid-column: 2/4;
}
.parent9 .photo-3{
  grid-row: 2/4;
  grid-column: 1/3;
}
.parent9 .photo-4{
  grid-row: 2/3;
  grid-column: 3/4;
}
.parent9 .photo-5{
  grid-row: 3/4;
  grid-column: 3/4;
}

/*
*/
.parent10{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent10 .photo-1{
  grid-row: 1/3;
  grid-column: 1/2;
}
.parent10 .photo-2{
  grid-row: 1/3;
  grid-column: 2/3;
}
.parent10 .photo-3{
  grid-row: 1/3;
  grid-column: 3/4;
}
.parent10 .photo-4{
  grid-row: 3/4;
  grid-column: 1/2;
}
.parent10 .photo-5{
  grid-row: 3/4;
  grid-column: 2/4;
}
.parent10 .photo-6{
  grid-row: 4/5;
  grid-column: 1/3;
}
.parent10 .photo-7{
  grid-row: 4/5;
  grid-column: 3/4;
}
.parent10 .photo-8{
  grid-row: 5/6;
  grid-column: 1/2;
}
.parent10 .photo-9{
  grid-row: 6/7;
  grid-column: 1/2;
}
.parent10 .photo-10{
  grid-row: 5/7;
  grid-column: 2/4;
}

/*
vol.8 
*/
.parent11{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}
.parent11 .photo-1{
  grid-row: 1/2;
  grid-column: 1/3;
}
.parent11 .photo-2{
  grid-row: 1/2;
  grid-column: 3/4;
}
.parent11 .photo-3{
  grid-row: 2/3;
  grid-column: 1/2;
}
.parent11 .photo-4{
  grid-row: 3/4;
  grid-column: 1/2;
}
.parent11 .photo-5{
  grid-row: 2/4;
  grid-column: 2/4;
}
/*
vol.9 
*/
.parent12{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}
.parent12 .photo-1{
  grid-row: 1/2;
  grid-column: 1/2;
}
.parent12 .photo-2{
  grid-row: 2/3;
  grid-column: 1/2;
}
.parent12 .photo-3{
  grid-row: 1/3;
  grid-column: 2/3;
}
.parent12 .photo-4{
  grid-row: 1/3;
  grid-column: 3/4;
}
.parent12 .photo-5{
  grid-row: 3/4;
  grid-column: 1/3;
}
.parent12 .photo-6{
  grid-row: 3/4;
  grid-column: 3/4;
}
/**/
.parent13{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}
.parent13 .photo-1{
  grid-row: 1/3;
  grid-column: 1/3;
}
.parent13 .photo-2{
  grid-row: 1/2;
  grid-column: 3/4;
}
.parent13 .photo-3{
  grid-row: 3/4;
  grid-column: 1/2;
}
.parent13 .photo-4{
  grid-row: 3/4;
  grid-column: 2/3;
}
.parent13 .photo-5{
  grid-row: 2/4;
  grid-column: 3/4;
}
/**/
.parent14{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent14 .photo-1{
  grid-row: 1/3;
  grid-column: 1/2;
}
.parent14 .photo-2{
  grid-row: 1/2;
  grid-column: 2/3;
}
.parent14 .photo-3{
  grid-row: 1/2;
  grid-column: 3/4;
}
.parent14 .photo-4{
  grid-row: 2/3;
  grid-column: 2/4;
}
.parent14 .photo-5{
  grid-row: 3/5;
  grid-column: 1/3;
}
.parent14 .photo-6{
  grid-row: 3/4;
  grid-column: 3/4;
}
.parent14 .photo-7{
  grid-row: 4/5;
  grid-column: 3/4;
}
.parent14 .photo-8{
  grid-row: 5/6;
  grid-column: 1/2;
}
.parent14 .photo-9{
  grid-row: 6/7;
  grid-column: 1/2;
}
.parent14 .photo-10{
  grid-row: 5/7;
  grid-column: 2/4;
}
/**/
.parent15{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 5px;
  width: 100%;
}

.parent15 .photo-1{
  grid-row: 1/2;
  grid-column: 1/3;
}
.parent15 .photo-2{
  grid-row: 1/2;
  grid-column: 3/4;
}
.parent15 .photo-3{
  grid-row: 2/4;
  grid-column: 1/2;
}
.parent15 .photo-4{
  grid-row: 2/4;
  grid-column: 2/3;
}
.parent15 .photo-5{
  grid-row: 2/4;
  grid-column: 3/4;
}
.parent15 .photo-6{
  grid-row: 4/5;
  grid-column: 1/2;
}
.parent15 .photo-7{
  grid-row: 4/5;
  grid-column: 2/4;
}
.parent15 .photo-8{
  grid-row: 5/7;
  grid-column: 1/3;
}
.parent15 .photo-9{
  grid-row: 5/6;
  grid-column: 3/4;
}
.parent15 .photo-10{
  grid-row: 6/7;
  grid-column: 3/4;
}
/*
animation
*/
/* 初期状態で非表示にする */
.photo-block {
  opacity: 0;
  transform: translateX(-120px);
  transition: opacity 1s ease, transform 1s ease;
}

/* アクティブ時に表示 */
.photo-block.active {
  opacity: 1;
  transform: translateY(0);
}

@media print, screen and (max-width: 767px){
.photo-block{
  margin-bottom: 40px;
}
 #rwd-content .photo-block .rwd-main-content-group{
    width: 100%!important;
}
.parent1,
.parent2,
.parent3,
.parent4,
.parent5,
.parent6,
.parent6b,
.parent7,
.parent8,
.parent9,
.parent10,
.parent11,
.parent12,
.parent13,
.parent14,
.parent15{
  grid-gap: 3px;
}
}
/* -------------------------------------------------
  Text-Block
------------------------------------------------- */
/* work-sans-regular - latin */
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/work-sans-v13-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/work-sans-v13-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/work-sans-v13-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/work-sans-v13-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/work-sans-v13-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/work-sans-v13-latin-regular.svg#WorkSans') format('svg'); /* Legacy iOS */
}

.text-block{
  margin-bottom: 50px;
}
.text-block p{
  font-family: 'Work Sans', sans-serif;
}
.text-block p{
  font-size: 1.8rem;
  color: #333333;
/*background: rgb(62,102,182);
background: linear-gradient(43deg, rgba(62,102,182,1) 0%, rgba(190,94,48,1) 25%, rgba(0,132,246,1) 64%, rgba(37,181,19,1) 81%, rgba(0,32,196,1) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;*/
}
.text-block p .italic{
  font-size: 1.8rem;
  font-style: italic;
}

@media print, screen and (max-width: 767px){
.text-block h2{
  font-size: 1.9rem;
  line-height: 1.4;
  margin-bottom: 0.7em;
}
.text-block{
  margin-bottom: 40px;
}
.text-block p{
  font-size: 1.6rem;
}
.text-block p .italic{
  font-size: 1.6rem;
  font-style: italic;
}
}
/* -------------------------------------------------
  #bottom-logo
------------------------------------------------- */

.bottom-logo{
  width: 350px;
  display: block;
  margin: 40px auto 0;
}

@media print, screen and (min-width: 768px){
  .bottom-logo a:hover {
    opacity: 0.5;
  }
}

@media print, screen and (max-width:767px){
  .bottom-logo {
    width: 200px;
  }
}


/* -------------------------------------------------
  Modal Zoom
------------------------------------------------- */
a.rwd-modal-link {
    position: relative;
    z-index: 5;
    display: inline-block;
  }
a.rwd-modal-link::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;
    background: rgba(255,255,255,0.4);
    opacity: 0;
    transition: all 0.2s ease-out;
  }
  a.rwd-modal-link::after {
    width: 35px;
    height: 37px;
    content: "";
    display: block;
    position: absolute;
    left: 45%;
    top: 45%;
    z-index: 10;
    background: url(../img/ico_001.png) no-repeat center center / contain;
    opacity: 0;
    transition: all 0.2s ease-out;
    transform: rotate(45deg);
  }
  a.rwd-modal-link:hover::before {
    opacity: 1;
  }
  a.rwd-modal-link:hover::after {
    opacity: 1;
    transform: rotate(0deg);
  }
  
@media print, screen and (max-width:767px){
  a.rwd-modal-link::after {
    display: none;
  }
  #cboxPrevious,
  #cboxPrevious {
    top: 60%;
  }
}

@media print, screen and (min-width: 768px){
#rwd-content .rwd-headline1-type02 {
    margin-top: 20px;
}
body #rwd-content .rwd-product-header .rwd-pc-margin-bottom40{
  margin-bottom:15px!important;
}
}

/*スクリーンリーダー対応*/
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
#rwd-content .rwd-modal-link:focus {
  outline: 2px solid #0091d1;
  outline-offset: -2px;
}