@media screen and (max-width:767px), print {
  [data-col] > .col {
    min-width: 100%;
    max-width: 100%;
    flex-basis: 100%;
  }
  [data-col='1'] .col-group > .col {
    min-width: 100%;
    max-width: 100%;
    flex-basis: 100%;
  }
  [data-col='2'] .col-group > .col {
    flex-basis: calc(100% /2);
  }
  [data-col='3'] .col-group > .col {
    flex-basis: calc(100% /3);
  }
  [data-col='4'] .col-group > .col {
    flex-basis: calc(100% /4);
  }
  [data-col='5'] .col-group > .col {
    flex-basis: calc(100% /5);
  }
  [data-col='6'] .col-group > .col {
    flex-basis: calc(100% /6);
  }
}
@media screen and (min-width:768px), print {
  .of--pc {
    display: inherit;
  }
  [class].of--pc {
    display: inherit;
  }
  .of--sp {
    display: none;
  }
  [class].of--sp {
    display: none;
  }
  .of--max-h-800 {
    max-height: 800px;
  }
  [data-col-wide='auto'] .col-group > .col {
    flex-basis: 100%;
	  	  border: 1px solid #e5e5e5;
  }
  [data-col-wide='2'] .col-group > .col {
    flex-basis: calc(100% /2);
  }
  [data-col-wide='3'] .col-group > .col {
    flex-basis: calc(80% /3);
	  margin: 5px;
  }
  [data-col-wide='4'] .col-group > .col {
    flex-basis: calc(100% /4);
  }
  [data-col-wide='5'] .col-group > .col {
    flex-basis: calc(100% /5);
  }
  [data-col-wide='6'] .col-group > .col {
    flex-basis: calc(100% /6);
  }
  *::-ms-backdrop {
    flex-basis: calc(100% /2 - 0.01%);
  }
  [data-col-wide='2'] .col-group > .col {
    flex-basis: calc(100% /2 - 0.01%);
  }
  *::-ms-backdrop {
    flex-basis: calc(100% /3 - 0.01%);
  }
  [data-col-wide='3'] .col-group > .col {
    flex-basis: calc(96.5% /3 - 0.01%);
	  border: 1px solid #e5e5e5;
  }
  *::-ms-backdrop {
    flex-basis: calc(100% /4 - 0.01%);
  }
  [data-col-wide='4'] .col-group > .col {
    flex-basis: calc(100% /4 - 0.01%);
  }
  *::-ms-backdrop {
    flex-basis: calc(100% /5 - 0.01%);
  }
  [data-col-wide='5'] .col-group > .col {
    flex-basis: calc(100% /5 - 0.01%);
  }
  *::-ms-backdrop {
    flex-basis: calc(100% /6 - 0.01%);
  }
  [data-col-wide='6'] .col-group > .col {
    flex-basis: calc(100% /6 - 0.01%);
  }
  [class*=mod-hdg-al] + .mod-txt {
    margin-bottom: 40px;
  }
}
.mod-pnl.of--flip .img {
  transition: transform 0.3s ease-in-out;
  width: 100%;
  max-width: 100%;
  transform: scale(1.00) rotate(0.01deg);
}
.mod-pnl.of--flip [href].col:hover .img {
  transform: scale(1.2) rotate(0.01deg);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.mod-pnl.of--flip .col > [href]:hover .img {
  transform: scale(1.2) rotate(0.01deg);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
[data-col].mod-pnl.of--flip .col-group {
  display: flex;
  flex-wrap: wrap;
}
[data-col-space='2'].mod-pnl.of--flip .col-inner {
  overflow: hidden;
  margin-top: 2px;
  display: inherit;
}
[data-col-space='2'].mod-pnl.of--flip .pnl-head {
  overflow: hidden;
  margin-top: 2px;
  display: inherit;
}
.mod-pnl.of--flip + :not(*) {
  margin-bottom: 80px;
}
.mod-pnl.of--flip.align-left {}
.mod-pnl.of--flip.align-right {}
.mod-pnl.of--flip.align-center {
  justify-content: center;
}
.mod-pnl.of--flip .col {
  position: relative;
}
.mod-pnl.of--flip .col a:hover {
  opacity: 1.0!important;
}
.mod-pnl.of--flip .pnl-head {
  overflow: hidden;
  display: block;
  position: relative;
}
.mod-pnl.of--flip .flip-wrap {
  padding: 0px 16px;
  width: 94.3%;
  text-align: center;
  bottom: 0px;
	left: 0;
  color: rgb(255, 255, 255);
  position: absolute;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.65);
/*	background: rgba(0,102,204,0.85);*/
}
.mod-pnl.of--flip .flip-wrap2 {
  padding: 0px 16px;
  width: 94.5%;
  text-align: center;
  bottom: 0px;
	color: rgb(255, 255, 255);
  position: absolute;
	left: 0px;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.65);
/*	background: rgba(0,102,204,0.85);*/
}
.of--flip .col .flip-wrap .title {
  font-size: 1.2rem;
  font-weight: bold;
  margin-top: 4px;
  margin-bottom: 4px;
}
.of--flip .col .flip-wrap2 .title {
  font-size: 1.8rem;
  font-weight: bold;
  margin-top: 4px;
  margin-bottom: 4px;
}
.of--flip .col .flip-wrap .description {
  margin-bottom: auto;
}
.of--flip .col .flip-wrap2 .description {
  margin-bottom: auto;
}
.mod-pnl.of--flip .col .flip-wrap .description.of--hover {
  height: 0px;
  opacity: 0;
	font-size:1.0em;
}
.mod-pnl.of--flip .col .flip-wrap2 .description.of--hover {
  height: 0px;
  opacity: 0;
	font-size:1.0em;
}





.mod-pnl.of--flip + .mod-btn {
  margin-top: -20px;
  margin-bottom: 20px;
}
.mod-pnl + .mod-list-news {
  margin-top: 20px;
}
.mod-pnl.of--flip .flip-wrap.of--gradient-t-b {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.3) 66%, rgba(0, 0, 0, 0) 100%);
}
.mod-pnl.of--flip .flip-wrap2.of--gradient-t-b {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.3) 66%, rgba(0, 0, 0, 0) 100%);
}
@media screen and (min-width:768px), print {
  [data-col-space='2'].mod-pnl.of--flip {
    margin-left: -2px;
  }
  [data-col-space='2']:first-child.mod-pnl.of--flip {
    margin-top: 0px;
  }
  [data-col-space='2'].mod-pnl.of--flip .col-inner {
    margin-left: 2px;
  }
  [data-col-space='2'].mod-pnl.of--flip .pnl-head {
    margin-left: 2px;
  }
  .of--flip .col .flip-wrap .title {
    font-size: 2.0rem;
    margin-top: auto;
    margin-bottom: auto;
  }
  .of--flip .col .flip-wrap .description {
    font-size: 1.8rem;
  }
  .mod-pnl.of--flip .flip-wrap {
    padding: 0px 24px;
  }
	
	
  .of--flip .col .flip-wrap2 .title {
    font-size: 2.0rem;
    margin-top: auto;
    margin-bottom: auto;
  }
  .of--flip .col .flip-wrap2 .description {
    font-size: 1.8rem;
  }
  .mod-pnl.of--flip .flip-wrap2 {
    padding: 0px 24px;
  }	
	
  .mod-pnl.of--flip + .mod-btn {
    margin-top: -40px;
    margin-bottom: 80px;
  }
  .mod-pnl + .mod-list-news {
    margin-top: 60px;
  }
}
@media screen and (max-width:1440px) and (min-width:768px), print {
  .of--flip .col .flip-wrap {
    padding: 2.8%;
  }
  .of--flip .col .flip-wrap .title {
    line-height: 1.4;
  }
  .mod-pnl.of--flip .col .flip-wrap .description {
    line-height: 1.4;
  }
  .of--flip .col .flip-wrap2 {
    padding: 2.8%;
  }
  .of--flip .col .flip-wrap2 .title {
    line-height: 1.4;
  }
  .mod-pnl.of--flip .col .flip-wrap2 .description {
    line-height: 1.4;
  }
}

/* --------------基本設定 */

img {
  vertical-align: bottom;
}
li {
  list-style: none;
}
ul {
  margin: 0px;
  padding: 0px;
}