@charset "utf-8";

/* -------------------------- Font --------------------------

font-family: "Zen Kaku Gothic New", serif;
font-weight: 300, 400, 500, 700, 900;

font-family: "Lato", serif;
font-weight: 100, 300, 400, 700, 900;

font-family: "Allison", cursive;
font-weight: 400;

*/

/* -------------------------- overwrite -------------------------- */

@media (max-width : 960px) {
  body{
    min-width:auto;
    overflow-x: hidden;
    color: #221815;
  }
}

/* -------------------------- Common -------------------------- */
.hydra-eye_wrap {
  font-family: "Zen Kaku Gothic New", serif;
  font-size: 16px;
  font-weight:400;
  letter-spacing: 0;
  line-height: 1.6;
  color:#000;
  overflow:hidden;
  --red: #da383d;
}
.hydra-eye_wrap img {
  vertical-align: middle;
}
.sp_block {
  display:none;
}

@media (max-width : 960px) {
  .hydra-eye_wrap {
    font-size: 14px;
  }
  .pc_block {
    display:none;
  }
  .sp_block {
    display:block;
  }
}

.hydra-eye_note {
  font-size:12px;
  line-height: 2.0;
  text-align: center;
  margin-top: 47px;
}

/* -------------------------- FV -------------------------- */

.hydra-eye_fv {
  position:relative;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: cover;
  padding-bottom: 80px;
  margin-bottom: -10vw;
  /* mask-repeat: no-repeat, no-repeat;
  mask-size: 100% 90px, 100% calc(100% - 90px);
  mask-position: left bottom, left top; */
  z-index: 5;
}
.hydra-eye_fv_inner {
  max-width: 1366px;
  margin: 0 auto;
  padding: 50px 32px 0;
  position: relative;
}
.hydra-eye_fv_shop {
  position: absolute;
  top: 0;
  left: 32px;
  z-index: 2;
}
.hydra-eye_fv_logo {
  width:27.45%;
  margin:0 auto 20px;
}
.hydra-eye_fv_logo > img{
  display:block;
  width:100%;
}
.hydra-eye_fv_catch {
  font-size: 32px;
  font-weight: 500;
  line-height: 1.75;
  text-align: center;
}
.hydra-eye_fv_img {
  width: 905px;
  margin: 0 auto 40px;
  text-align: center;
  position: relative;
}
.hydra-eye_fv_badge {
  position:absolute;
  bottom: 0;
  left: 64px;
  display:flex;
  justify-content: center;
  align-items: center;
  width:190px;
  height:190px;
}
.hydra-eye_fv_badge_circle {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  animation: hydexTextRotate 8s linear infinite;
}
@keyframes hydexTextRotate {
  0% {
    transform:rotate(0deg);
  }
  100% {
    transform:rotate(360deg);
  }
}
.hydra-eye_fv_badge_text {
  font-weight: 500;
  font-size: 25px;
  line-height: 1.36;
  letter-spacing: 0.05em;
  text-align: center;
}
.hydra-eye_fv_badge_text > small{
  font-size:10px;
  vertical-align: super;
}
.hydra-eye_fv_topics {
  position: absolute;
  top: -30px;
  right: -3px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.hydra-eye_fv_topics img.fv_topics01{
  width: 241px;
  height: 241px;
  margin-right: 40px;
  position: relative;
  z-index: 3;
}
.hydra-eye_fv_topics img.fv_topics02{
  width: 217px;
  height: 215px;
  margin-right: 0;
  margin-top: -80px;
  position: relative;
  z-index: 1;
}
.hydra-eye_fv_shapes {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: -1;
}


@media (max-width: 960px) {
  .hydra-eye_fv{
    padding: 0;
  }
  .hydra-eye_fv_inner {
    padding: 17.3vw 20px 10vw;
  }
  .hydra-eye_fv_shop {
    width: 32.13%;
  }
  .hydra-eye_fv_logo {
    width: 69.3vw;
    margin: 0 auto 5.8vw;
  }
  .hydra-eye_fv_catch {
    width: 88%;
    margin: 0 auto;
    font-size: clamp(12px, 4.8vw, 36px);
    line-height: 1.3;
  }
  .hydra-eye_fv_catch p {
    margin: 5.3vw 0 8vw;
  }
  .hydra-eye_fv_img {
    width: 100%;
  }
  .hydra-eye_fv_img img {
    width: 40vw;
  }
  /* .hydra-eye_fv_img::after {
    width: clamp(170px, 45vw, 250px);
  } */
  .hydra-eye_fv_badge{
    width: max(70px, 20.26vw);
    height: max(70px, 20.26vw);
    left: 0;
  }
  .hydra-eye_fv_badge_text {
    font-size: max(11px, 2.6vw);
    line-height: 1.6;
  }
  .hydra-eye_fv_topics {
    top: 0;
    right: 0;
  }
  .hydra-eye_fv_topics img.fv_topics01{
    width: 29.3vw;
    height: 29.3vw;
    margin-right: 6vw;
  }
  .hydra-eye_fv_topics img.fv_topics02{
    width: 26.6vw;
    height: 26.6vw;
    margin-right: 0;
    margin-top: -11vw;
  }
}


/* -------------------------- FV 商品説明 -------------------------- */
.hydra-eye_explanation {
  padding-top: 15vw;
  padding-bottom: 0;
  position: relative;
  z-index: 3;
  background: url('../images/explanation_bg.jpg') no-repeat top center / cover;
}
.hydra-eye_explanation_inner {
  max-width: 800px;
  margin: 0 auto; 
  position: relative;
}
.hydra-eye_explanation span.marker {
  background:linear-gradient(transparent 60%, #d1c6de 60%);
}
.hydra-eye_explanation_sec_title {
  text-align: center;
}
.hydra-eye_explanation_sec_title h2 {
  font-size: 42px;
  line-height: 1.35;
  letter-spacing: 0.05em;
  color: var(--red);
  margin: 60px auto;
}
.hydra-eye_explanation_sec_text {
  font-size: 20px;
  font-weight: 500;
  line-height: 2.5;
  letter-spacing: 0.05em;
  text-align: center;
  margin-bottom: 50px;
}
.hydra-eye_explanation_sec_text p {
  margin: 0 0 1.6em;
}
.hydra-eye_explanation_box {
  max-width: 700px;
  margin: 0 auto 80px;
}
.hydra-eye_explanation_box_title {
  background: #0f1419;
  margin: 0;
  padding: 28px 10px;
  color: #fff;
  text-align: center;
  font-size: 26px;
  border-radius: 10px 10px 0 0;
}
.hydra-eye_explanation_box_title span {
  font-size: 22px;
}
.hydra-eye_explanation_box_title span.hydra-eye_explanation_box_title_big {
  font-size: 46px;
}
.hydra-eye_explanation_list {
  background: #fff;
  padding: 40px 70px 30px;
  font-size: 20px;
  position: relative;
  filter: drop-shadow(0 3px 0 #5b4f4a);
}
.hydra-eye_explanation_list::before {
  content: "";
  position: absolute;
  top: calc(100% - 0.5px);
  left: 0;
  width: 100%;
  height: 50px;
  background: #fff;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  z-index: 0;
  pointer-events: none;
}
.hydra-eye_explanation_list li:not(:last-of-type) {
  margin-bottom: 25px;
}
.hydra-eye_explanation_list li::before {
  content: '';
  position: relative;
  display: inline-block;
  top: 11px;
  margin-right: 15px;
  width: 38px;
  height: 38px;
  background: url('../images/icon-check.png') no-repeat;
  background-size: contain;
}
.hydra-eye_explanation_sec-bottom {
  text-align: center;
}
.hydra-eye_explanation_sec-bottom_img01 {
  margin-bottom: 56px;
}
@media (max-width : 960px) {
  .hydra-eye_explanation {
    margin: 0; 
    background: url('../images/explanation_bg_sp.jpg') no-repeat top center / cover;
  }
  .hydra-eye_explanation_inner {
    padding-left: 20px;
    padding-right: 20px;
  }
  .hydra-eye_explanation_sec_title img {
    width: 56.2vw;
  }
  .hydra-eye_explanation_sec_title h2 {
    font-size: clamp(20px, 6.66vw, 50px);
    margin: 8vw auto;
  }
  .hydra-eye_explanation_sec_text {
    font-size: clamp(14px, 2.93vw, 22px);
    letter-spacing: 0.04em;
  }
  .hydra-eye_explanation_sec_text span {
    display: inline-block;
  }
  .hydra-eye_explanation_note {
    line-height: 1.5;
  }
  .hydra-eye_explanation_box_title {
    padding: max(17px, 4.53vw) 10px;
    font-size: max(14px, 3.46vw);
  }
  .hydra-eye_explanation_box_title span {
    font-size: max(12px, 2.93vw);
  }
  .hydra-eye_explanation_box_title span.hydra-eye_explanation_box_title_big {
    font-size: clamp(23px, 6.13vw, 46px);
  }
  .hydra-eye_explanation_list {
    padding: max(25px, 3.33vw);
    font-size: clamp(17px, 2.66vw, 24px);
  }
  .hydra-eye_explanation_list li:not(:last-of-type) {
    margin-bottom: 0.8em;
  }
  .hydra-eye_explanation_list li::before {
    width: 5vw;
    height: 5vw;
    top: 0.3em;
  }
  .hydra-eye_explanation_sec-bottom_img01 {
    width: 54.26vw;
    margin-bottom: 3.68vw;
  }
}

@media (max-width : 640px) {
  .hydra-eye_explanation_inner {
    padding-left: 10px;
    padding-right: 10px;
  }

}

/* -------------------------- 365 days -------------------------- */

.hydapd_every{
  display:block;
  background: url(../images/sec_bg04.png) 50% 50% / cover no-repeat;
}
.hydapd_every_bottom{
  position:relative;
  background-image:url('../images/every_bottom_bg.jpg');
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  padding:65px 0 48px;
 }
.hydapd_every_title {
  position:absolute;
  display:block;
  top:-40px;
  left:50%;
  width:266px;
  margin: 0;
  transform:translateX(-50%);
}
.hydapd_every_title > img{
  display:block;
  width:100%;
}
.hydapd_every_catch {
  font-size:40px;
  letter-spacing: 0.05em;
  text-align: center;
  margin:0 0 18px;
  color: var(--red);
  line-height: 1;
}
.hydapd_every_desc {
  font-size:28px;
  letter-spacing: 0.05em;
  text-align: center;
  margin:0 0 26px;
  line-height: 1;
}
.hydapd_every_points {
  display:flex;
  justify-content: center;
  gap: 0 19px;
  transition:opacity 1s, transform 1s;
}
.hydapd_every_points_row {
  display: contents;
}
.hydapd_every_points.standby {
  opacity:0;
  transform:translateY(50px);
}
.hydapd_every_points > img{
  width:150px;
}

@media (max-width : 960px) {
	.hydapd_every{
  	background-image: url(../images/sec_bg04_sp.png);
	}
  .hydapd_every_bottom{
    padding:62px 0 48px;
   }
  .hydapd_every_title{
    top:-30px;
    width:213px;
  }
  .hydapd_every_catch{
    font-size: clamp(24px, 6vw, 52px);
    margin: 0 0 13px;
  }
  .hydapd_every_desc{
    font-size:18px;
    margin:0 0 24px;
  }
  .hydapd_every_points{
    margin:0 auto;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  .hydapd_every_points_row {
    display: flex;
    justify-content: center;
    gap: 4vw;
  }
  .hydapd_every_points img{
    width: clamp(80px, 25.6vw, 192px);
  }
}

/* -------------------------- Appear -------------------------- */

/*.hydra-eye_apr{
	position: relative;
  background-color: #eef0ff;
  padding-bottom:20px;
  overflow: hidden;
}
.hydra-eye_apr_in{
  max-width:800px;
  background-repeat: no-repeat;
  background-position: 50% 32px;
  background-size: 100% auto;
  padding-top:72px;
  padding-bottom: 72px;
  margin:0 auto;
}
.hydra-eye_apr_main{
  display:flex;
  margin:0 0 16px;
}
.hydra-eye_apr_main_left{
  flex:1;
}
.hydra-eye_apr_title{
  font-weight:500;
  font-size:36px;
  line-height: 1.77;
  letter-spacing: 0.05em;
  color:#00a0b8;
  margin:20px 0 12px;
}
.hydra-eye_apr_title > small{
  font-size:16px;
  vertical-align: super;
}
.hydra-eye_apr_desc_01{
  width:100%;
  font-size:16px;
  line-height: 2;
  letter-spacing: 0.05em;
  margin:0 0 16px;
}
.hydra-eye_apr_desc_02{
  width:100%;
  font-size:16px;
  line-height: 2;
  letter-spacing: 0.05em;
}
.hydra-eye_apr_desc_02 > small{
  font-size:10px;
  vertical-align: super;
}
.hydra-eye_apr_main_right{
	position: relative;
  width:280px;
  z-index: 1;
}
.hydra-eye_apr_video{
  width:100%;
}
.hydra-eye_apr_note{
  font-size:10px;
  line-height:1.8;
}

@media (max-width : 960px) {
  .hydra-eye_apr{
    padding-bottom:20px;
  }
  .hydra-eye_apr_in{
    max-width:none;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% auto;
    padding-top:40px;
    margin:0;
  }
  .hydra-eye_apr_main{
    display:block;
    margin:0 0 35px;
  }
  .hydra-eye_apr_main_left{
    padding-left:25px;
    margin:0 0 20px;
  }
  .hydra-eye_apr_title{
    font-size:25px;
    line-height: 1.48;
    margin:16px 0;
  }
  .hydra-eye_apr_title > small{
    font-size:12px;
  }
  .hydra-eye_apr_desc_01{
    width:225px;
    font-size:14px;
    line-height: 1.85;
    margin:0;
  }
  .hydra-eye_apr_desc_02{
    width:auto;
    font-size:14px;
    line-height: 1.85;
    padding:0 25px;
    margin:0 0 10px;
  }
  .hydra-eye_apr_main_right{
    width:250px;
  }
  .hydra-eye_apr_note{
    font-size:10px;
    line-height:1.5;
    padding:0 25px;
  }
}
*/
/* -------------------------- Point Background -------------------------- */

.hydra-eye_pt {
  position:relative;
  /* background-repeat: repeat-y; */
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
}
.hydra-eye_pt_in {
  width: 905px;
  margin: 0 auto;
  position: relative;
}

.hydra-eye_pt_fv_ball_03{
  position:absolute;
  z-index:5;
  top:359px;
  left:706px;
  width:191px;
}
.hydra-eye_pt_fv_ball_04{
  position:absolute;
  z-index:15;
  top:304px;
  left:805px;
  width:106px;
}
.hydra-eye_pt_fv_ball_05{
  position:absolute;
  z-index:5;
  top:303px;
  left:1003px;
  width:318px;
}
.hydra-eye_pt_fv_ball_06{
  position:absolute;
  z-index:5;
  top:51px;
  left:1218px;
  width:115px;
}
@media screen and (max-width:960px) {
  .hydra-eye_pt_in {
    width: auto;
  }
}

/* -------------------------- Point Fv -------------------------- */

.hydra-eye_pt_fv {
  position: relative;
  margin: 0 auto 24px;
  padding-top: 70px;
}
.hydra-eye_pt_fv_water{
  position:absolute;
  z-index:5;
  top:33px;
  left:386px;
  width:197px;
}
.hydra-eye_pt_fv_water_sp{
  display:none;
}
.hydra-eye_pt_fv_title{
  max-width: 905px;
  margin: 0 auto 40px;
  text-align: center;
}
.hydra-eye_pt_fv_title > span{
  display: block;
  font-weight: 500;
  font-size: 30px;
  margin:0 0 25px;
}
.hydra-eye_pt_fv_title > img{
  display:block;
  width:177px;
  margin: 0 auto;
}

@media (max-width : 960px) {
  .hydra-eye_pt_fv{
    position:relative;
    max-width:none;
    /* aspect-ratio: 1 / 1.8333; */
    margin:0 auto 30px;
  }
  .hydra-eye_pt_fv_ball_01{
    display:none;
  }
  .hydra-eye_pt_fv_ball_02{
    z-index:5;
    top:44.97%;
    left:-29.46%;
    width:58.93%;
  }
  .hydra-eye_pt_fv_ball_03{
    z-index:5;
    top:54.53%;
    left:56.8%;
    width:39.86%;
  }
  .hydra-eye_pt_fv_ball_04{
    z-index:15;
    top:48.48%;
    left:77.33%;
    width:24.4%;
  }
  .hydra-eye_pt_fv_ball_05{
    display:none;
  }
  .hydra-eye_pt_fv_ball_06{
    display:none;
  }
  .hydra-eye_pt_fv_water_sp{
    display:block;
    position:absolute;
    z-index:5;
    top:7.84%;
    left:-18.13%;
    width:51.6%;
  }
  .hydra-eye_pt_fv_title {
    width: 100%;
    line-height: 1.2;
    text-align: center;
    z-index: 14;
  }
  .hydra-eye_pt_fv_title > span{
    margin:0 0 12px;
  }
  .hydra-eye_pt_fv_title > img{
    display: block;
    width: 36.6vw;
  }
}

/* -------------------------- ふわふわ揺れるアニメ（共通で使う） -------------------------- */

.hydra-eye_bubble{
  animation-name: hydexAnimBubble;
  animation-duration: 2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
.hydra-eye_bubble.ver1{
  animation-duration: 1.2s;
}
.hydra-eye_bubble.ver2{
  animation-duration: 1.4s;
}
.hydra-eye_bubble.ver3{
  animation-duration: 1.6s;
}
.hydra-eye_bubble.ver4{
  animation-duration: 1.8s;
}
.hydra-eye_bubble.ver5{
  animation-duration: 2.0s;
}
.hydra-eye_bubble.ver6{
  animation-duration: 2.2s;
}

@keyframes hydexAnimBubble {
  0% {
    transform:translateY(0);
  }
  100% {
    transform:translateY(50px);
  }
}

/* -------------------------- Point Section Head (Common) -------------------------- */

.hydra-eye_pt {
  padding: 65px 15px 0;
}
.hydra-eye_pt_sec_head {
  position:relative;
  z-index: 2;
  max-width: 905px;
  margin: 0 auto;
  padding: 0;
}
.hydra-eye_pt_sec_head_title_point {
  display:flex;
  justify-content: center;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 25px;
}
/*.hydra-eye_pt_sec_head_title_point > div:nth-child(1){
  font-family: "Lato", serif;
  font-weight:300;
  font-size:20px;
  letter-spacing: 0.05em;
  padding:3px 15px 3px 0;
}
.hydra-eye_pt_sec_head_title_point > div:nth-child(1) > span{
  font-weight:700;
  font-size:28px;
}
.hydra-eye_pt_sec_head_title_point > div:nth-child(2){
  font-family: "Lato", serif;
  font-weight:400;
  font-size:30px;
  border-left:1px solid #000;
  padding:3px 0 3px 15px;
}
.hydra-eye_pt_sec_head_title_point > div:nth-child(2) small {
  font-size: inherit;
}*/
.hydra-eye_pt_sec_head_title_text {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  font-weight: 400;
  letter-spacing: 0.05em;
  text-align: center;
}
.hydra-eye_pt_sec_head_title_text_jp {
  margin: 0 auto 20px;
  font-size: 40px;
  font-weight: 400;
}
.hydra-eye_pt_sec_head_title_text_jp span {
  display: block;
  font-size: 30px;
}
.hydra-eye_pt_sec_head_title_text_en {
  margin-bottom: 40px;
}
.hydra-eye_pt_sec_head_desc {
  font-size:16px;
  line-height:2;
  letter-spacing: 0.05em;
}
.hydra-eye_pt_sec_head_desc.pt2{
  letter-spacing: 0;
}
.hydra-eye_pt_sec_head_desc > small{
  font-size:10px;
  vertical-align: super;
}

@media (max-width : 960px) {
  .hydra-eye_pt {
    padding: 70px 0;
  }
  .hydra-eye_pt_sec_head{
    max-width: none;
    padding: 0 15px;
    margin: 0 auto;
  }
  .hydra-eye_pt_sec_head_title_point{
    width: 27.2vw;
    margin: 0 auto;
  }
  .hydra-eye_pt_sec_head_title_point > div:nth-child(1){
    font-size:18px;
    padding:3px 10px 3px 0;
  }
  .hydra-eye_pt_sec_head_title_point > div:nth-child(1) > span{
    font-size:25px;
  }
  .hydra-eye_pt_sec_head_title_point > div:nth-child(2){
    font-size:20px;
    padding:3px 0 3px 10px;
  }
  .hydra-eye_pt_sec_head_title_point > div:nth-child(2) small {
    display: block;
    padding: 3px 0;
    font-size: 70%;
  }
  .hydra-eye_pt_sec_head_title_point > div:nth-child(2).pt3{
    font-size:23px;
  }
  .hydra-eye_pt_sec_head_title_text_jp {
    font-size: 5.33vw;
    margin-bottom: 2vw;
  }
  .hydra-eye_pt_sec_head_title_text_jp span {
    font-size: 4vw;
  }
  .hydra-eye_pt_sec_head_title_text{
    font-size:25px;
    line-height:1.48;
    padding:6px 0;
  }
  .hydra-eye_pt_sec_head_desc{
    font-size:14px;
    line-height:1.85;
  }
  .hydra-eye_pt_sec_head_desc.pt2{
    letter-spacing: 0;
  }
}

/* -------------------------- Point 1 body -------------------------- */

.hydra-eye_pt1_body {
  position:relative;
  max-width: 905px;
  margin: 0 auto 65px;
  padding: 0;
}
.hydra-eye_pt1_in {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.hydra-eye_pt1_in_left {
  width: 390px;
  line-height: 1.66;
}

.hydra-eye_pt1_body_note {
  max-width: 905px;
  font-size:12px;
  line-height:1.8;
  margin:0 auto;
}

.hydra-eye_pt1-1_body_item.item_2 {
  border: 3px solid var(--red);
  border-radius: 8px;
  padding: 30px 32px;
}
.hydra-eye_pt1-1_body_item.item_2 p {
  margin: 0;
}
.hydra-eye_pt1-1_body_item.item_2 .hydra-eye_pt1-1_body_item_title {
  font-size: 18px;
  margin: 0 0 1em;
}
@media (max-width : 960px) {
  .hydra-eye_pt1_body{
    position:relative;
    max-width:none;
    padding: 0 20px 10vw;
    margin: 0 auto;
  }

  .hydra-eye_pt1_body_item {
    width:200px !important;
    margin:0 7.5px;
  }
  .hydra-eye_pt1_body_note {
    position:relative;
    z-index:2;
    max-width:none;
    font-size:10px;
    line-height:1.5;
    margin:0;
  }
  .hydra-eye_pt1_in {
    flex-direction: column-reverse;
  }
  .hydra-eye_pt1_in_left {
    width: auto;
  }
  .hydra-eye_pt1-1_body_item.item_2 {
    padding: 4vw 4.2vw;
  }
  .hydra-eye_pt1-1_body_item.item_2 p {
    margin: 0;
  }
  .hydra-eye_pt1-1_body_item.item_2 .hydra-eye_pt1-1_body_item_title {
    font-size: 1.2em;
    margin: 0 0 1em;
  }
}

/* -------------------------- Point 2 body -------------------------- */

.hydra-eye_pt2_body {
  position:relative;
  max-width: 905px;
  margin: 0 auto;
  padding: 0;
}
.hydra-eye_pt2_in {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: center;
}
.hydra-eye_pt2_in_left {
  width: 390px;
  line-height: 1.66;
}
.hydra-eye_pt2_ball_01 {
  position:absolute;
  top:-60px;
  left:1102px;
  display:block;
  width:199px;
}
.hydra-eye_pt2_ball_02 {
  position:absolute;
  top:350px;
  left:-58px;
  display:block;
  width:297px;
}
.hydra-eye_pt2_body_item.item_2 {
  margin-bottom: 40px
}

@media (max-width : 960px) {
  .hydra-eye_pt2_body {
    max-width:none;
    padding: 0 20px;
    margin: 0;
  }
  .hydra-eye_pt2_in {
    flex-direction: column-reverse;
  }
  .hydra-eye_pt2_in_left {
    width: auto;
  }
  .hydra-eye_pt2_line{
    top:132px;
    left:0;
    width:100%;
  }
  .hydra-eye_pt2_ball_01{
    top:-40px;
    left:auto;
    right:-7.06%;
    width:18.66%;
  }
  .hydra-eye_pt2_ball_02{
    display:none;
  }
  .hydra-eye_pt2_herb_list{
    display:block;
    max-width:none;
    margin:0;
  }
  .hydra-eye_pt2_herb_item{
    width:150px !important;
    margin:0 5px;
  }

  .hydra-eye_pt2_herb_list .slick-dots {
    position: static;
    bottom: auto;
    display: flex;
    justify-content: center;
    gap:0 5px;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
    margin:15px 0 0;
  }
  .hydra-eye_pt2_herb_list .slick-dots li {
    position: relative;
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0;
    padding: 0;
    cursor: pointer;
  }
  .hydra-eye_pt2_herb_list .slick-dots li button {
    display: block;
    width: 8px;
    height: 8px;
    padding: 0;
    border: 1px solid #000;
    border-radius:50%;
  }
  .hydra-eye_pt2_herb_list .slick-dots li.slick-active button {
    background-color: #000;
  }
  .hydra-eye_pt2_body_item.item_2 {
    margin-bottom: 20px
  }
}

/* -------------------------- Point 3 body -------------------------- */

.hydra-eye_pt3_body {
  position:relative;
  max-width: 905px;
  margin: 0 auto;
  padding: 0 15px 50px;
}
.hydra-eye_pt3_ball_01 {
  position:absolute;
  top:10px;
  left:-116px;
  display:block;
  width:175px;
}
.hydra-eye_pt3_ball_02 {
  position:absolute;
  top:70px;
  right:-218px;
  display:block;
  width:300px;
}
.hydra-eye_pt3_desc {
  font-size:18px;
  line-height:2;
  letter-spacing: 0.025em;
  margin-bottom:40px;
}
.hydra-eye_pt3_desc sub {
  display: inline-block;
  font-size: 60%;
  vertical-align: text-top;
}
.hydra-eye_pt3_note {
  font-size: 12px;
  line-height: 1.6;
}

.hydra-eye_pt3_body_item_title {
  text-align: center;
  font-size: 30px;
  font-weight: 400;
}
.hydra-eye_pt3_body_item_list {
  display: flex;
  justify-content: center;
  gap: 20px;
  max-width: 905px;
  margin: 0 auto 30px;
  text-align: center;
}
.hydra-eye_pt3_body_note {
  max-width: 905px;
  font-size:12px;
  line-height:1.8;
  margin:0 auto;
  text-align: center;
}
@media (max-width : 960px) {
  .hydra-eye_pt3_body{
    max-width: none;
    padding: 0;
    margin:0;
  }
  .hydra-eye_pt3_ball_01{
    top:-15px;
    left:-27.06%;
    width:40.26%;
  }
  .hydra-eye_pt3_ball_02{
    top:85px;
    right:-15.2%;
    width:55.73%;
  }
  .hydra-eye_pt3_catch {
    display:block;
    width: 120%;
    margin-left: -20%;
    margin-bottom: 26px;
    order:2;
  }
  
  .hydra-eye_pt3_body_item_title {
    font-size: 4.5vw;
  }
  .hydra-eye_pt3_desc {
    order:1;
    flex:1; 
    font-size:14px;
    line-height:1.85;
    padding: 0 20px;
    margin:0;
  }
  .hydra-eye_pt3_note {
    order:3;
    width:100%;
    font-size:10px;
    margin-top:8px;
    line-height: 1.3;
  }

  .hydra-eye_pt3_body_item_list {
    display: block;
  }
  .hydra-eye_pt3_body_item_list .slick-dots {
    position: static;
    bottom: auto;
    display: flex;
    justify-content: center;
    gap:0 5px;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
    margin:15px 0 0;
  }
  .hydra-eye_pt3_body_item_list .slick-dots li {
    position: relative;
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0;
    padding: 0;
    cursor: pointer;
  }
  .hydra-eye_pt3_body_item_list .slick-dots li button {
    display: block;
    width: 8px;
    height: 8px;
    padding: 0;
    border: 1px solid #000;
    border-radius:50%;
  }
  .hydra-eye_pt3_body_item_list .slick-dots li button::before {
    display: none;
  }
  .hydra-eye_pt3_body_item_list .slick-dots li.slick-active button {
    background-color: #000;
  }
  .hydra-eye_pt3_body_note {
    max-width: 90%;
    font-size: 10px;
  }
}

/* -------------------------- 365 days -------------------------- */

.hydra-eye_every{
  display:block;
}
.hydra-eye_every_bottom{
  position:relative;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  padding:65px 0 48px;
 }
.hydra-eye_every_title{
  position:absolute;
  top:-40px;
  left:50%;
  transform:translateX(-50%);
  display:block;
  width:266px;
}
.hydra-eye_every_title > img{
  display:block;
  width:100%;
}
.hydra-eye_every_catch{
  font-size:40px;
  letter-spacing: 0.05em;
  text-align: center;
  margin:0 0 18px;
}
.hydra-eye_every_catch > span{
  color:#945cad;
}
.hydra-eye_every_desc{
  font-size:28px;
  letter-spacing: 0.05em;
  text-align: center;
  margin:0 0 26px;
}
.hydra-eye_every_points{
  display:flex;
  justify-content: center;
  gap:0 19px;
  transition:opacity 1s, transform 1s;
}
.hydra-eye_every_points.standby{
  opacity:0;
  transform:translateY(50px);
}
.hydra-eye_every_points > img{
  width:150px;
}

@media (max-width : 960px) {
  .hydra-eye_every_bottom{
    padding:62px 0 48px;
   }
  .hydra-eye_every_title{
    top:-30px;
    width:213px;
  }
  .hydra-eye_every_catch{
    font-size:28px;
    margin:0 0 13px;
  }
  .hydra-eye_every_desc{
    font-size:18px;
    margin:0 0 24px;
  }
  .hydra-eye_every_points{
    display:flex;
    flex-flow:row wrap;
    justify-content: center;
    gap:10px 15px;
    max-width:260px;
    margin:0 auto;
  }
  .hydra-eye_every_points > img{
    width:120px;
  }
}

/* -------------------------- 365 days -------------------------- */

.hydra-eye_howto {
  background-color: #fff;
  padding:70px 0 50px;
}
.hydra-eye_howto_in{
  width: 905px;
  margin:0 auto;
}
.hydra-eye_howto_title {
  display: block;
  margin:0 auto 25px;
  text-align: center;
}
.hydra-eye_howto_list{
  display:flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 39px 0;
  margin: 0 auto;
}
.hydra-eye_howto_item_pic {
  height: 123px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.hydra-eye_howto_item {
  width: 241px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.hydra-eye_howto_item::after {
  content: '';
  width: 46px;
  height: 40px;
  background: url('../images/howto_arrow-r.png') no-repeat center / contain;
  position: absolute;
  right: -70px;
  top: 45px;
}
.hydra-eye_howto_item:nth-child(1):after,
.hydra-eye_howto_item:nth-child(4):after {
  display: none;
}
.hydra-eye_howto_item.item_1 {
  width: 100%;
  flex-direction: row;
  justify-content: center;
  gap: 25px;
}
.hydra-eye_howto_item_desc{
  font-size:16px;
  line-height:1.875;
  text-align: justify;
}
.hydra-eye_howto_after{
  display:flex;
  flex-flow:column nowrap;
  justify-content: center;
  align-items: center;
  gap:12px 0;
  height:90px;
  background-color: #FFF;
}
.hydra-eye_howto_after_title{
  font-weight:700;
  font-size:16px;
  color:#945cad;
}
.hydra-eye_howto_after_desc{
  font-size:16px;
}

@media (max-width : 960px) {
  .hydra-eye_howto{
    padding:50px 0;
  }
  .hydra-eye_howto_in{
    width: auto;
    margin: 0 auto;
    padding: 0 20px;
  }
  .hydra-eye_howto_title{
    display:block;
    margin:0 0 20px;
  }
  .hydra-eye_howto_list {
    display:flex;
    flex-direction: column;
    gap: 30px;
    margin: 0 auto 40px;
  }
  .hydra-eye_howto_item {
    width: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  .hydra-eye_howto_item::after {
    width: 4.26vw;
    height: 4vw;
    transform: rotate(90deg);
    background: url('../images/howto_arrow-r.png') no-repeat center / contain;
    position: absolute;
    right: 0;
    left: 0;
    top: auto;
    bottom: -20px;
    margin: auto;
  }
  .hydra-eye_howto_item_pic {
    height: auto;
  }
  .hydra-eye_howto_item_pic.item_4{
    position:static;
  }
  .hydra-eye_howto_item_pic.item_4 > img{
    position:static;
    width:100%;
  }
  .hydra-eye_howto_item_desc{
    font-size:14px;
    line-height:1.71;
    width: 65.3%;
    padding: 0 15px;
  }
  .hydra-eye_howto_after{
    gap:0 0;
    height:80px;
    background-color: #FFF;
  }
  .hydra-eye_howto_after_title{
    font-size:14px;
    line-height:1.71;
  }
  .hydra-eye_howto_after_desc{
    font-size:14px;
    line-height:1.71;
    text-align: center;
  }
}

@media (max-width : 640px) {
  .hydra-eye_howto_item_pic {
    width: 38%;
  }
  .hydra-eye_howto_item_pic img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .hydra-eye_howto_item_pic {
    width: 38%;
    height: 80px;
  }
  .hydra-eye_howto_item.item_1 {
    gap: 0;
  }
  .hydra-eye_howto_item_desc {
    padding: 0 0 0 15px;
  }
}

/* -------------------------- Offer -------------------------- */

.hydra-eye_offer{
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  background-color: #fdf0b7;
  aspect-ratio: 1 / 0.5;
  padding: 90px 0 50px;
}
.hydra-eye_offer_in {
  position: relative;
  max-width: 905px;
  margin: 0 auto;
}
.hydra-eye_offer_bg_v{
  position:absolute;
  top:140px;
  right:-216px;
  display:block;
  width:477px;
}
.hydra-eye_offer_bg_v > img{
  display:block;
  width:100%;
  max-width:none;
  height:auto;
}
.hydra-eye_offer_body{
  position:relative;
  z-index:2;
  display:flex;
  justify-content: space-between;
  align-items: center;
}
.hydra-eye_offer_body_left{
  position:relative;
  flex:1;
}
.hydra-eye_offer_title{
  width:375px;
  margin:0 auto 20px;
  text-align: center;
}
.hydra-eye_offer_title > img{
  display:block;
  width:100%;
}
.hydra-eye_fv_img.sp {
  display: none;
}
.hydra-eye_offer_desc{
  font-size: 32px;
  text-align: center;
  color: var(--red);
  font-weight: 500;
}
.hydra-eye_offer_item_title{
  width:400px;
  font-weight:600;
  font-size:24px;
  line-height:1.5;
  letter-spacing: 0.05em;
  padding-top: 45px;
} 
.hydra-eye_offer_item_count{
  width:400px;
  font-weight:600;
  font-size:18px;
  line-height:1.5;
  padding-top: 15px;
}
.hydra-eye_offer_item_price {
  width:400px;
  font-weight:600;
  font-size:22px;
  line-height:1.5;
  padding-top: 25px;
}
.hydra-eye_offer_note{
  width:400px;
  font-weight:400;
  font-size:12px;
  line-height:1.5;
  padding-top: 25px;
}
.hydra-eye_offer_body_right{
  width:380px;
}
.hydra-eye_offer_box {
  background-color: #FFF;
  border-radius: 15px;
  overflow:hidden;
  padding:0 0 22px;
  border: 3px solid var(--red);
}

.hydra-eye_offer_box_title {
  font-weight: 500;
  font-size: 24px;
  letter-spacing: 0.1em;
  text-align: center;
  color:#fff;
  background-color: var(--red);
  border: 1px solid var(--red);
  padding: 18px 0;
  margin: 0 0 30px;
}
.hydra-eye_offer_box_txt {
  margin-bottom: 16px;
  text-align: center;
}
.hydra-eye_offer_box_day {
  font-size: 24px;
  font-weight: 500;
  margin: 0 auto 17px;
}
.hydra-eye_offer_box_showcase {
  display:flex;
  justify-content: center;
  align-items: center;
  gap:0 15px;
  margin:0 0 20px;
}
.hydra-eye_offer_box_showcase_pic {
  width:105px;
  text-align:center;
}
.hydra-eye_offer_box_showcase_pic > img{
  width:auto;
}
.hydra-eye_offer_box_showcase_info {
  width:180px;
  text-align:center;
}
.hydra-eye_offer_box_showcase_labels {
  display:flex;
  justify-content: space-between;
  margin:0 0 5px;
}
.hydra-eye_offer_box_showcase_labels > span{
  display:flex;
  justify-content: center;
  align-items: center;
  width:85px;
  height:30px;
  background-color: #2f5194;
  font-weight:700;
  font-size:18px;
  color:#fff;
  letter-spacing: 0.05em;
}
.hydra-eye_offer_box_showcase_price {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
.hydra-eye_offer_box_showcase_price > p {
  margin: 0;
  font-size: 20px;
  font-weight: 500;
}
.hydra-eye_offer_box_showcase_price > p > span{
  font-size: 30px;
}
.hydra-eye_offer_box_cta {
  display:flex;
  justify-content: center;
  align-items: center;
  width:340px;
  height:50px;
  background-color: var(--red);
  font-weight:700;
  font-size:16px;
  letter-spacing: 0.05em;
  color:#fff;
  margin:0 auto 21px;text-decoration: none;
}
.hydra-eye_offer_box_about_sbsc {
  text-align:center;
}
.hydra-eye_offer_box_about_sbsc > a {
  font-weight:500;
  font-size:16px;
  letter-spacing: 0;
  text-align:center;
  text-decoration: underline;
  color:#4d4d4d;
}
.hydra-eye_offer_item_btn {
  padding-top: 60px;
}
.hydra-eye_offer_item_btn a.hydra-eye_offer_item_btn_search {
  width: 370px;
  font-weight:400;
  font-size: 24px;
  text-align: center;
  background: #945cad;
  border-radius: 100vh;
  box-sizing: border-box;
  color: #fff;
  display: block;
  padding: 30px 60px;
  margin: 0 auto;
}
@media (max-width : 960px) {
  .hydra-eye_offer{
    /* background-size: 100% auto; */
    background-color: #e8e8f0;
    aspect-ratio: auto;
    padding: 90px 15px 0;  
    text-align: center;
  }
  .hydra-eye_offer_in{
    max-width:none;
    padding: 0;  
    margin:0 auto;
  }
  .hydra-eye_offer_bg_v{
    position:absolute;
    top:535px;
    right:0;
    width:293px;
  }  
  .hydra-eye_offer_body{
    max-width: none;
    display: block;
  }
  .hydra-eye_offer_body_left {
    width: 84%;
    max-width: none;
    display: block;
    margin: 0 0 10vw;
    padding: 0;
  }
  .hydra-eye_fv_img.sp {
    display: block;
  }
  .hydra-eye_offer_title{
    width: min(250px, 66.6%);
    min-height:auto;
    padding: 0;
    margin: 0 auto 15px;
  }
  .hydra-eye_offer_item_title {
    width: auto;
    font-size: 15px;
    text-align: center;
  }
  .hydra-eye_offer_item_count {
    width: auto;
    font-size: 12px;
    text-align: center;
    margin-top: 0;
    font-weight: 400;
  }
  .hydra-eye_offer_item_price {
    width: auto;
    font-size: 12px;
    text-align: center;
  }
  .hydra-eye_offer_title > img{
    width:100%;
  }
  .hydra-eye_offer_desc{
    width:auto;
    text-align: center;
    font-size: clamp(22px, 4.8vw, 36px);
    line-height: 1.7;
    margin: 0 auto 30px;
  }
  .hydra-eye_offer_note{
    position:static;
    width:325px;
    font-size:10px;
    line-height:1.5;
    padding-right:0;
    margin:15px auto 0;
  }  
  .hydra-eye_offer_body_right{
    width:auto;
    padding-left: 0;
  }
  .hydra-eye_offer_item_btn {
    padding-top: 26px;
  }
  .hydra-eye_offer_item_btn a.hydra-eye_offer_item_btn_search {
    width: 85%;
    font-size: 15px;
    padding: 15px 10px;
  }
  .hydra-eye_offer_box{
    border-radius:12px;
    padding:0 0 25px;
    border: 1px solid #00a0b8;
  }
  .hydra-eye_offer_box:last-child {
    border-color: #fff;
  }
  .hydra-eye_offer_box:not(:last-child){
    margin:0 0 25px;
  }

  .hydra-eye_offer_box_showcase{
    gap:0 15px;
    margin:0 0 20px;
  }
  .hydra-eye_offer_box_showcase_pic{
    width:90px;
  }
  .hydra-eye_offer_box_showcase_pic > img{
    width:auto;
  }
  .hydra-eye_offer_box_showcase_pic > img.sheets7{
    width:65px;
  }
  .hydra-eye_offer_box_showcase_info{
    width: 200px;
  }
  .hydra-eye_offer_box_showcase_labels{
    margin:0 0 10px;
  }
  .hydra-eye_offer_box_showcase_labels > span{
    width:75px;
    height:25px;
    font-size:15px;
  }
  .hydra-eye_offer_box_showcase_price{
    font-size:14px;
    line-height:calc(45/28);
  }
  .hydra-eye_offer_box_showcase_price > span{
    font-size:19px;
  }

  .hydra-eye_offer_box_cta{
    width: 85%;
    height: max(50px, 10vw);
    font-size: max(14px, 3.3vw);
    letter-spacing: 0;
    margin:0 auto 21px;
  }
}

@media (max-width : 640px) {
  .hydra-eye_offer_body_left {
    width: 100%;
    padding-right: 25%;
  }
}

/* -------------------------- Info -------------------------- */

.hydra-eye_info{
  padding:50px 0;
}
.hydra-eye_info_in{
  max-width:800px;
  margin:0 auto;
}
.hydra-eye_info_block{
  margin:0 0 20px;
}
.hydra-eye_info_block_title{
  display:flex;
  align-items: center;
  height:52px;
  font-weight:500;
  font-size:20px;
  letter-spacing: 0.05em;
  color:#4d4d4d;
  border-top:2px solid #4d4d4d;
  background-repeat: no-repeat;
  background-position: right top 24px;
  background-size: 22px auto;
  padding-top: 20px;
  text-decoration: none;
}

.hydra-eye_info_block_content{
  font-weight:400;
  font-size:14px;
  line-height:calc(24/14);
  padding-top:20px;
}
.hydra-eye_info_block.last{
  border-bottom:2px solid #4d4d4d;
  padding-bottom:20px;
}

@media (max-width : 960px) {
  .hydra-eye_info{
    padding:53px 0 40px;
  }
  .hydra-eye_info_in{
    max-width: none;
  }
  .hydra-eye_info_block{
    margin:0 0 20px;
  }
  .hydra-eye_info_block_title{
    height:40px;
    font-size:14px;
    /*border-bottom:1px solid #4d4d4d;*/
    background-size:15px auto;
    background-position: right 20px;
  }
  .hydra-eye_info_block_content{
    font-size:11px;
    line-height:calc(34/22);
    padding-top:16px;
  }
  .hydra-eye_info_block_content.last{
    border-bottom:1px solid #4d4d4d;
    padding-bottom:20px;
  }
}

@media screen and (max-width : 640px) {
  .hydra-eye_offer_box {
    width: 84%;
    margin: 0 auto;
  }
  .hydra-eye_offer_box, .hydra-eye_offer_box:last-child {
    width: 84%;
    padding-bottom: 20px;
    margin: 0 auto;
    border: 1px solid #da383d;
  }
  .hydra-eye_offer_box_title {
    padding: 10px 10px 12px;
    margin-bottom: 20px;
    font-size: 17px;
  }
  .hydra-eye_offer_box_txt {
    font-size: 12px;
  }
  .hydra-eye_offer_box_day {
    margin-bottom: 2px;
    font-size: 20px;
    letter-spacing: 2px;
  }
  .hydra-eye_offer_box_showcase {
    padding: 0 30px;
  }
  .hydra-eye_offer_box_showcase_info {
    width: auto;
    white-space: nowrap;
  }
  .hydra-eye_offer_box_showcase_pic {
    width: auto;
    min-width: 28%;
  }
  .hydra-eye_offer_box_showcase_price > p {
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 1;
    letter-spacing: 2px;
  }
  .hydra-eye_offer_box_cta {
    width: calc(100% - 40px);
    margin: 0 auto;
  }
}

/* -------------------------- More -------------------------- */

.hydra-eye_more{
  padding:0 0 50px;
}
.hydra-eye_more_main{
  position:relative;
}
.hydra-eye_more_main_image{
  display:block;
}
.hydra-eye_more_main_image > img{
  display:block;
  width:100%;
}
.hydra-eye_more_main_title{
  position:absolute;
  bottom:48px;
  left:50%;
  transform:translateX(-50%);
}
.hydra-eye_more_main_title > h2{
  font-family: "Allison", cursive;
  font-size:80px;
  line-height:0.8;
  text-align:center;
  margin:0;
}
.hydra-eye_more_main_title > p{
  font-size:22px;
  letter-spacing: 0.05em;
  text-align:center;
}
.hydra-eye_more_list{
  display:flex;
  flex-wrap: wrap;
  justify-content: center;
  gap:20px;
  max-width:1080px;
  margin:0 auto;
}
.hydra-eye_more_item{
  width:320px;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
  padding:20px;
}
.hydra-eye_more_item_in{
  position:relative;
  background-color:rgba(255,255,255,0.9);
  border:1px solid #000;
  padding-bottom:20px;
}
.hydra-eye_more_item_badge{
  position:absolute;
  top:30px;
  left:-16px;
  display:flex;
  justify-content: center;
  align-items: center;
  width:95px;
  height:95px;
  border-radius:50%;
  background-color: #000;
}
.hydra-eye_more_item_badge_text{
  font-weight:500;
  font-size:16px;
  line-height:1.375;
  letter-spacing: 0.05em;
  text-align: center;
  color:#FFF;
}
.hydra-eye_more_item_badge_text > small{
  font-size:10px;
  vertical-align: super;
}
.hydra-eye_more_item_pic{
  position:relative;
  z-index:2;
  display:block;
  height:185px;
  padding:28px 8px 0;
}
.hydra-eye_more_item_pic > img{
  display:block;
  width:198px;
  margin-left:auto;
}
.hydra-eye_more_item_note{
  font-size:10px;
  text-align: center;
  margin:0 0 17px;
}
.hydra-eye_more_item_title{
  display:flex;
  justify-content: center;
  align-items: center;
  height:40px;
  background-color: #000;
  font-weight:500;
  font-size:18px;
  letter-spacing: 0.05em;
  color:#FFF;
  margin:0 0 20px;
}
.hydra-eye_more_item_data{
  display:flex;
  justify-content: center;
  margin:0 0 16px;
}
.hydra-eye_more_item_data_one{
  text-align: center;
  padding:2px 6px;
}
.hydra-eye_more_item_data_one:nth-child(2){
  border-left:1px solid #000;
}
.hydra-eye_more_item_count{
  font-size:16px;
  letter-spacing: 0.05em;
  margin:0 0 8px;
}
.hydra-eye_more_item_price{
  font-size:22px;
  letter-spacing: 0.05em;
}
.hydra-eye_more_item_price > small{
  font-size:16px;
}
.hydra-eye_more_item_cta{
  display:flex;
  justify-content: center;
  align-items: center;
  width:240px;
  height:60px;
  background-color: #FFF;
  border:1px solid #ffce23;
  font-weight:700;
  font-size:16px;
  color:#ffce23;
  margin:0 auto;
}

.hydra-eye_more_item.hydra_ex .hydra-eye_more_item_in{
  border:1px solid #552378;
}
.hydra-eye_more_item.hydra_az .hydra-eye_more_item_in{
  border:1px solid #00a0b8;
}
.hydra-eye_more_item.hydra_v .hydra-eye_more_item_in{
  border:1px solid #ff2323;
}
.hydra-eye_more_item.hydra_f .hydra-eye_more_item_badge{
  left:-8px;
  width:105px;
  height:105px;
}
.hydra-eye_more_item.hydra_ex .hydra-eye_more_item_badge{
  background-color: #552378;
}
.hydra-eye_more_item.hydra_az .hydra-eye_more_item_badge{
  background-color: #00a0b8;
}
.hydra-eye_more_item.hydra_v .hydra-eye_more_item_badge{
  background-color: #ff2323;
}
.hydra-eye_more_item.hydra_f .hydra-eye_more_item_pic{
  padding:20px 0 0;
}
.hydra-eye_more_item.hydra_f .hydra-eye_more_item_pic > img{
  width:106px;
  margin:0 auto;
}
.hydra-eye_more_item.hydra_ex .hydra-eye_more_item_title{
  background-color: #552378;
}
.hydra-eye_more_item.hydra_az .hydra-eye_more_item_title{
  background-color: #00a0b8;
}
.hydra-eye_more_item.hydra_v .hydra-eye_more_item_title{
  background-color: #ff2323;
}
.hydra-eye_more_item.hydra_ex .hydra-eye_more_item_data_one:nth-child(2){
  border-left:1px solid #552378;
}
.hydra-eye_more_item.hydra_az .hydra-eye_more_item_data_one:nth-child(2){
  border-left:1px solid #00a0b8;
}
.hydra-eye_more_item.hydra_v .hydra-eye_more_item_data_one:nth-child(2){
  border-left:1px solid #ff2323;
}
.hydra-eye_more_item.hydra_ex .hydra-eye_more_item_cta{
  border:1px solid #552378;
  color:#552378;
}
.hydra-eye_more_item.hydra_az .hydra-eye_more_item_cta{
  border:1px solid #00a0b8;
  color:#00a0b8;
}
.hydra-eye_more_item.hydra_v .hydra-eye_more_item_cta{
  border:1px solid #ff2323;
  color:#ff2323;
}
.hydra-eye_more_item.hydra_v .hydra-eye_more_item_note {
  margin-bottom: 7px;
}

.hydra-eye_more_to_top{
  padding:50px 0 0;
}
.hydra-eye_more_to_top > a{
  display:flex;
  justify-content: center;
  align-items: center;
  width:380px;
  height:50px;
  background-color: #eef0ff;
  border:1px solid #000;
  border-radius:24px;
  font-size:16px;
  margin:0 auto;
}

@media (max-width : 960px) {
  .hydra-eye_more{
    padding:0 0 45px;
  }
  .hydra-eye_more_main{
    padding-bottom:70px;
  }
  .hydra-eye_more_main_title{
    bottom:30px;
  }
  .hydra-eye_more_main_title > h2{
    font-size:70px;
    line-height:0.8;
    margin:0;
  }
  .hydra-eye_more_main_title > p{
    font-size:18px;
    white-space: nowrap;
  }
  .hydra-eye_more_list{
    display:block;
  }
  .hydra-eye_more_item{
    width:315px !important;
    padding:15px;
    margin:0 7.5px;
  }
  .hydra-eye_more_item_in{
    padding-bottom:15px;
  }
  .hydra-eye_more_item_badge{
    position:absolute;
    top:40px;
    left:-10px;
  }
  .hydra-eye_more_item_badge_text{
    font-size:16px;
    line-height:1.4;
  }
  .hydra-eye_more_item_pic{
    height:188px;
    padding:37px 8px 0;
  }
  .hydra-eye_more_item_pic > img{
    width:199px;
  }
  .hydra-eye_more_item_note{
    margin:0 0 15px;
  }
  .hydra-eye_more_item_title{
    height:35px;
    font-size:18px;
    margin:0 0 10px;
  }
  .hydra-eye_more_item_data{
    margin:0 0 9px;
  }
  .hydra-eye_more_item_data_one{
    text-align: center;
    padding:2px 14px;
  }
  .hydra-eye_more_item_count{
    font-size:14px;
    margin:0 0 8px;
  }
  .hydra-eye_more_item_price{
    font-size:19px;
  }
  .hydra-eye_more_item_price > small{
    font-size:14px;
  }
  .hydra-eye_more_item_cta{
    width:255px;
    height:50px;
    font-size:14px;
  }
  
  .hydra-eye_more_item.hydra_f .hydra-eye_more_item_badge{
    top:35px;
    left:4px;
    width:100px;
    height:100px;
  }
  .hydra-eye_more_item.hydra_f .hydra-eye_more_item_pic{
    padding:34px 0 0 5px;
  }
  .hydra-eye_more_item.hydra_f .hydra-eye_more_item_pic > img{
    width:101px;
    margin:0 auto;
  }

  .hydra-eye_more_list .slick-dots {
    position: static;
    bottom: auto;
    display: flex;
    justify-content: center;
    gap:0 5px;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
    margin:25px 0 0;
  }
  .hydra-eye_more_list .slick-dots li {
    position: relative;
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0;
    padding: 0;
    cursor: pointer;
  }
  .hydra-eye_more_list .slick-dots li button {
    display: block;
    width: 8px;
    height: 8px;
    padding: 0;
    border: 1px solid #000;
    border-radius:50%;
  }
  .hydra-eye_more_list .slick-dots li.slick-active button {
    background-color: #000;
  }

  .hydra-eye_more_to_top{
    padding:26px 0 0;
  }
  .hydra-eye_more_to_top > a{
    width:315px;
    height:40px;
    border-radius:20px;
    font-size:14px;
  }
}


/*==============================================================*/


/* 元々あったCSS 定期の注釈のようだが今はコメントアウトされてる */
.detail-teiki_note {
  display: block;
  padding: 15px 0;
  margin-top: 20px;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: #df667e;
}

/* CSSファイル内だと file_root_path が使えないため background-image だけここに記述 */
.hydra-eye_fv{
  background-image:url('../images/fv_bg.png');
  /* mask-image: url(../images/fv-bg-mask.svg), url(../images/bg-mask-inset.svg); */
}
.hydra-eye_apr_in{
  background-image:url('../images/apr_bg.png');
}
.hydra-eye_pt
{
  background-image:url('../images/pt1_bg.png');
}
.hydra-eye_every_bottom{
  background-image:url('../images/every_bottom_bg.jpg');
}
.hydra-eye_offer{
  background-image:url('../images/offer_bg.png');
}
.hydra-eye_info_block_title{
  background-image:url('../images/info_ic_plus.png');
}
.hydra-eye_info_block_title.active{
  background-image:url('../images/info_ic_minus.png');
}
.hydra-eye_more_item{
  background-image:url('../images/more_pdt_hydra_f_bg.jpg');
}
.hydra-eye_more_item.hydra_f{
  background-image: url('../images/more_pdt_hydra_f_bg.jpg')
}
.hydra-eye_more_item.hydra_ex{
  background-image:url('../images/more_pdt_hydra_ex_bg.jpg');
}
.hydra-eye_more_item.hydra_az{
  background-image:url('../images/more_pdt_hydra_az_bg.jpg');
}
.hydra-eye_more_item.hydra_v {
  background-image:url('../images/more_pdt_hydra_v_bg.jpg');
}

@media (max-width : 960px) {
  .hydra-eye_fv{
    background-image:url('../images/fv_bg_sp.png');
  }
  .hydra-eye_apr_in{
    background-image:url('../images/apr_bg_sp.jpg');
  }
  /* .hydra-eye_pt
{
    background-image:url('../images/pt1_bg_sp.jpg');
  } */
  .hydra-eye_every_bottom{
    background-image:url('../images/every_bottom_bg_sp.jpg');
  }
  .hydra-eye_offer{
    background-image:url('../images/offer_bg_sp.png');
  }
}

.hydra-eye_pt1-1_body_item_list {  
  max-width: 800px;
  margin: 0 auto 30px;
}
.hydra-eye_pt1-1_body_item.item_1 {
  margin-bottom: 45px;
}
.hydra-eye_pt1-1_body_item.item_2 {
  margin-bottom: 45px;
}


.tag {
  padding: 7px 16px 8px;
  margin-right: 12px;
  font-size: 22px;
  line-height: 1.1;
  border: 1px solid;
  border-radius: 50px;
}
.hydra-eye_fv_catch small {
  font-size: 10px;
  vertical-align: top;
}

@media (max-width : 960px) {
  .hydra-eye_pt1-1_body_item_list {
    display: block;
  }
  .hydra-eye_pt0_body_item.item_1 {
    margin-bottom: 25px;
  }
  .hydra-eye_pt1-1_body_item.item_2 {
    margin-bottom: 25px;
  }
  .hydra-eye_pt2_body .slick-list .slick-slide {
    padding: 0 7.5px;
  }
  .tag {
    display: flex;
    padding: 0;
    width: 70px;
    height: 70px;
    font-size: 16px;
    align-items: center;
    justify-content: center;
  }
  .hydra-eye_pt3_catch:last-child {
    width: 200%;
    margin: 78px 0 0 -100%;
  }
}

.hydra-eye_pt_fv_title span.color {
  color: #00a0b8;
}

/*================================================*/
/*あわ*/

.hydra-eye_apr_ball {
  position: absolute;
}
.hydra-eye_apr_ball_01 {
  top: 27px;
  left: 20px;
}
.hydra-eye_apr_ball_02 {
  right: 0;
  bottom: 58px;
  width: 360px;
}

.hydra-eye_pt_ball {
  position: absolute;
}
.hydra-eye_fv-shape01 {
  top: -60px;
  left: -60px;
}
.hydra-eye_fv-shape02 {
  top: -160px;
  right: -240px;
}

.hydra-eye_pt_ball_01 {
  position:absolute;
  z-index:5;
  top: 80px;
  left: -250px;
}
.hydra-eye_pt_ball_02 {
  position:absolute;
  z-index: 5;
  top: -30px;
  right: -330px;
  margin-left: auto;
}
.hydra-eye_pt_ball_03 {
  top: -50px;
  left: 23.5%;
  z-index: 16;
}
.hydra-eye_pt_ball_04 {
  top: 15%;
  right: 18%;
}
.hydra-eye_pt_ball_05 {
  top: 14%;
  left: 21%;
  z-index: 2;
}
.hydra-eye_pt_ball_06 {
  top: 183px;
  right: 280px;
  z-index: 10;
}
.hydra-eye_pt_ball_07 {
  top: 295px;
  right: 20px;
}
.hydra-eye_pt_ball_08 {
  left: -184px;
  bottom: 68px;
}
.hydra-eye_pt_ball_09 {
  top: 204px;
  right: -138px;
}
.hydra-eye_pt_ball_10 {
  left: 20px;
  bottom: 35px;
}
.hydra-eye_pt_ball_11 {
  top: -40px;
  right: 10px;
}
.hydra-eye_pt_ball_12 {
  top: -15%;
  left: -17%;
}

@media (max-width : 960px) {
  .hydra-eye_fv-shape01 {
    width: 30vw;
    top: 10vw;
    left: -10vw;
  }
  .hydra-eye_fv-shape02 {
    width: 35vw;
    top:  5vw;
    right:  -10vw;
  }
  .hydra-eye_apr_ball_01 {
    display: none;
  }
  .hydra-eye_apr_ball_02 {
    right: -30%;
    bottom: 172px;
    width: 274px;
  }
  .hydra-eye_pt_ball_01 {
    display: none;
  }
  .hydra-eye_pt_ball_02 {
    /* left: 20px; */
    /* width: 122px; */
    width: 60px;
  }
  .hydra-eye_pt_ball_03 {
    left: 4px;
    top: -20px;
    width: 110px;
  }
  .hydra-eye_pt_ball_04 {
    left: -20px;
    top: 400px;
    width: 94px;
  }
  .hydra-eye_pt_ball_05 {
    top: 50px;
    left: auto;
    right: 5px;
    width: 90px;
  }
  .hydra-eye_pt_ball_06 {
    top: 140px;
    right: -40px;
    z-index: 13;
  }
  .hydra-eye_pt_ball_07 {
    top: 54%;
    right: -45px;
    width: 190px;
  }
  .hydra-eye_pt_ball_08 {
    left: -110px;
    bottom: 46%;
    width: 333px;
  }
  .hydra-eye_pt_ball_10 {
    width: 54px;
    left: auto;
    right: -10px;
    bottom: 15%;
  }
  .hydra-eye_pt_ball_11 {
    top: 33%;
    right: 16%;
    width: 152px;
  }
}

/*あわ*/
/*================================================*/

@media (min-width : 961px) {
  .hydra-eye_pt3_body_item_list .hydra-eye_pt3_body_item {
    width: 24%;
    max-width: 230px;
  }
}
@media (max-width : 960px) {
  .product_show_view img.hydra-eye_pt3_body_item {
    max-width: 230px;
  }
}