@charset "UTF-8";

/*all----------------------------*/
html {
  font-size: 62.5%;
}

body {
  -webkit-tap-highlight-color: transparent;
}

#Wrap {
  width: auto;
}

footer {
  position: relative;
  z-index: 2;
}

.nav-top {
  display: none;
  z-index: 5;
}

:root {
  --color_regular: #000;
  --color_cat01_01: #F1C800;
  --color_cat01_02: #FFEB8A;
  --color_cat01_03: #685A00;
  --color_cat02_01: #3A9CFF;
  --color_cat02_02: #A5D2FF;
  --color_cat02_03: #003468;
  --color_cat03_01: #3BD8EE;
  --color_cat03_02: #C5F8FF;
  --color_cat03_03: #005D68;
  --color_cat04_01: #31D89C;
  --color_cat04_02: #89FBD2;
  --color_cat04_03: #006841;
}

.LP_page * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 1;
  letter-spacing: .1em;
  font-optical-sizing: auto;
}

.LP_page {
  position: relative;
  color: #000;
  font-family: YakuHanJP_Narrow, pragmatica, "Hiragino Sans", "ヒラギノ角ゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ ProN", "ヒラギノ角ゴ Pro", 'Noto Sans JP', "メイリオ", "Meiryo", sans-serif;
  overflow-x: clip;
}

.LP_page::before {
  position: fixed;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100lvh;
  background: url(../img/bg_001.jpg) center center / cover no-repeat;
  content: "";
}

.LP_page .txt_cursive {
  font-family: YakuHanJP_Narrow, "Mrs Saint Delafield", cursive;
}

.LP_page picture {
  display: block;
  font-size: 0;
}

.LP_page a {
  display: block;
}

.LP_page a:hover {
  opacity: 1 !important;
}

.LP_page img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

/*----------------------------all*/

/*mv-----------------------------*/
.mv_area {
  padding: 3rem 0 7rem;
  background: linear-gradient(rgba(255, 255, 255, 1), rgba(255, 255, 255, .7));
}

.main_ttl {
  width: 100rem;
  margin: 0 auto 4rem;
}

.main_lead {
  text-align: center;
  font-size: 1.6rem;
}

.main_lead span {
  display: block;
  line-height: 2;
}

.main_lead span:nth-of-type(n+2) {
  margin-top: 3rem;
}

.anchor-link_wrap {
  margin-top: 8rem;
}

.anchor-link_wrap h3 {
  width: 11rem;
  margin: 0 auto 3rem;
}

.anchor-link_wrap ul {
  display: flex;
  justify-content: center;
  gap: 1rem;
}

.anchor-link_wrap ul li {
  position: relative;
  z-index: 1;
}

.anchor-link_wrap ul li::before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  margin: .5rem 0 0 .5rem;
  opacity: .2;
  content: "";
  transition: margin .3s;
}

.anchor-link_wrap ul li:hover::before {
  margin: .25rem 0 0 .25rem;
}

.anchor-link_wrap ul li:nth-of-type(1)::before {
  background: var(--color_cat01_01);
}

.anchor-link_wrap ul li:nth-of-type(2)::before {
  background: var(--color_cat02_01);
}

.anchor-link_wrap ul li:nth-of-type(3)::before {
  background: var(--color_cat03_01);
}

.anchor-link_wrap ul li:nth-of-type(4)::before {
  background: var(--color_cat04_01);
}

.anchor-link_wrap ul li a {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 20rem;
  height: 8rem;
  font-weight: 600;
  font-size: 2rem;
  text-align: center;
  color: #fff;
  transition: transform .3s;
}

.anchor-link_wrap ul li a:hover {
  transform: translate(.25rem, .25rem);
}

.anchor-link_wrap ul li:nth-of-type(1) a {
  background: var(--color_cat01_01);
}

.anchor-link_wrap ul li:nth-of-type(2) a {
  background: var(--color_cat02_01);
}

.anchor-link_wrap ul li:nth-of-type(3) a {
  background: var(--color_cat03_01);
}

.anchor-link_wrap ul li:nth-of-type(4) a {
  background: var(--color_cat04_01);
}

.anchor-link_wrap ul li a::before {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  border-right: solid #fff;
  border-bottom: solid #fff;
  border-width: .1rem;
  width: .8rem;
  height: .8rem;
  margin-bottom: 1.2rem;
  content: "";
  transition: margin .3s;
}

.anchor-link_wrap ul li a:hover::before {
  margin-bottom: .5rem;
}

.anchor-link_wrap ul li a::after {
  position: absolute;
  z-index: -1;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 5.8rem;
  height: 5.8rem;
  content: "";
  opacity: .2;
}

.anchor-link_wrap ul li:nth-of-type(1) a::after {
  background: url(../img/icon_011.svg) center center / cover no-repeat;
}

.anchor-link_wrap ul li:nth-of-type(2) a::after {
  background: url(../img/icon_021.svg) center center / cover no-repeat;
}

.anchor-link_wrap ul li:nth-of-type(3) a::after {
  background: url(../img/icon_031.svg) center center / cover no-repeat;
}

.anchor-link_wrap ul li:nth-of-type(4) a::after {
  background: url(../img/icon_041.svg) center center / cover no-repeat;
}

.anchor-link_wrap ul li a .txt_cursive {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%) rotate(-3deg);
  margin-top: -.7rem;
  font-weight: 400;
  font-size: 2.6rem;
  letter-spacing: 0;
  white-space: nowrap;
}

.anchor-link_wrap ul li:nth-of-type(1) a .txt_cursive {
  color: var(--color_cat01_02);
}

.anchor-link_wrap ul li:nth-of-type(2) a .txt_cursive {
  color: var(--color_cat02_02);
}

.anchor-link_wrap ul li:nth-of-type(3) a .txt_cursive {
  color: var(--color_cat03_02);
}

.anchor-link_wrap ul li:nth-of-type(4) a .txt_cursive {
  color: var(--color_cat04_02);
}
/*-----------------------------mv*/

/*itm-----------------------------*/
.each_sec {
  position: relative;
  z-index: 1;
  padding-top: 6rem;
}

.each_sec::before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100% - 18rem);
  content: "";
  opacity: .7;
}

#UVCare.each_sec::before {
  background: linear-gradient(#fff 10%, #FCF8CE, #FFFBD2, #FEFFE4, #fff);
}

#BodyCare.each_sec::before {
  background: linear-gradient(#fff 10%, #CBE2FC, #D6F2FF, #B7EEFF, #fff);
}

#InnerCare.each_sec::before {
  background: linear-gradient(#fff 10%, #CEFDFF, #CEFFFB, #EBFFFF, #fff);
}

#InsectRepellent.each_sec::before {
  background: linear-gradient(#fff 10%, #CEFFEE, #D6FFE6, #B7FFCF, #fff);
}

.sec_ttl {
  position: relative;
  margin-bottom: 1.5rem;
  padding-top: 5rem;
  font-weight: 600;
  font-size: 3rem;
  text-align: center;
}

#UVCare .sec_ttl {
  color: var(--color_cat01_03);
}

#BodyCare .sec_ttl {
  color: var(--color_cat02_03);
}

#InnerCare .sec_ttl {
  color: var(--color_cat03_03);
}

#InsectRepellent .sec_ttl {
  color: var(--color_cat04_03);
}

.sec_ttl::before {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 4.5rem;
  height: 4.5rem;
  content: "";
}

#UVCare .sec_ttl::before {
  background: url(../img/icon_011.svg) center center / cover no-repeat;
}

#BodyCare .sec_ttl::before {
  background: url(../img/icon_021.svg) center center / cover no-repeat;
}

#InnerCare .sec_ttl::before {
  background: url(../img/icon_031.svg) center center / cover no-repeat;
}

#InsectRepellent .sec_ttl::before {
  background: url(../img/icon_041.svg) center center / cover no-repeat;
}

.sec_ttl .txt_cursive {
  display: block;
  margin-top: 1rem;
  transform: rotate(-3deg);
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: 0;
  opacity: .6;
}

.sec_lead {
  margin-bottom: 5rem;
  font-size: 1.8rem;
  line-height: 1.75;
  text-align: center;
}

#UVCare .sec_lead {
  color: var(--color_cat01_03);
}

#BodyCare .sec_lead {
  color: var(--color_cat02_03);
}

#InnerCare .sec_lead {
  color: var(--color_cat03_03);
}

#InsectRepellent .sec_lead {
  color: var(--color_cat04_03);
}

.itm_list_warp {
  position: relative;
  z-index: 1;
  padding-bottom: 6rem;
}

.itm_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 4rem;
  width: 84rem;
  margin: 0 auto;
}

.itm_list li {
  padding: 4rem;
  background: rgba(255, 255, 255, .7);
  box-shadow: 0 0 10px rgba(0, 0, 0, .1);
}

.itm_list li .itm_img_wrap {
  position: relative;
  margin-bottom: 1.5rem;
}

.itm_list li .itm_img a img {
  transition: opacity .3s;
}

.itm_list li .itm_img a:hover img {
  opacity: .6;
}

#UVCare .itm_list li .itm_img {
  box-shadow: 0 0 10px rgba(104, 90, 0, .1);
}

#BodyCare .itm_list li .itm_img {
  box-shadow: 0 0 10px rgba(0, 52, 104, .1);
}

#InnerCare .itm_list li .itm_img {
  box-shadow: 0 0 10px rgba(0, 93, 104, .1);
}

#InsectRepellent .itm_list li .itm_img {
  box-shadow: 0 0 10px rgba(0, 104, 65, .1);
}

.itm_list li .itm_feature {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  place-items: center;
  width: 10rem;
  height: 10rem;
  border-radius: 50%;
  margin: -2.5rem 0 0 -2.5rem;
  font-size: 1.4rem;
  line-height: 1.5;
  text-align: center;
  color: #fff;
  pointer-events: none;
}

#UVCare .itm_list li .itm_feature {
  background: var(--color_cat01_01);
}

#BodyCare .itm_list li .itm_feature {
  background: var(--color_cat02_01);
}

#InnerCare .itm_list li .itm_feature {
  background: var(--color_cat03_01);
}

#InsectRepellent .itm_list li .itm_feature {
  background: var(--color_cat04_01);
}

.itm_list li .itm_copy {
  margin-bottom: 2rem;
  font-family: "Noto Serif JP", serif;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.75;
}

#UVCare .itm_list li .itm_copy  {
  color: var(--color_cat01_03);
}

#BodyCare .itm_list li .itm_copy  {
  color: var(--color_cat02_03);
}

#InnerCare .itm_list li .itm_copy  {
  color: var(--color_cat03_03);
}

#InsectRepellent .itm_list li .itm_copy  {
  color: var(--color_cat04_03);
}

.itm_list li .itm_name {
  margin-bottom: 2rem;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .05em;
}

.itm_list li .txt_wrap > div > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.itm_list li .itm_price {
  font-weight: 500;
  font-size: 2.6rem;
  letter-spacing: .02em;
}

.itm_list li .itm_price .txt_S {
  font-weight: 400;
  font-size: 1.1rem;
}

.itm_list li .itm_link {
  position: relative;
  z-index: 1;
  width: fit-content;
}

.itm_list li .itm_link::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: .5rem 0 0 .5rem;
  opacity: .2;
  content: "";
  transition: margin .3s;
}

.itm_list li .itm_link:hover::before {
  margin: .25rem 0 0 .25rem;
}

#UVCare .itm_list li .itm_link::before {
  background: var(--color_cat01_01);
}

#BodyCare .itm_list li .itm_link::before {
  background: var(--color_cat02_01);
}

#InnerCare .itm_list li .itm_link::before {
  background: var(--color_cat03_01);
}

#InsectRepellent .itm_list li .itm_link::before {
  background: var(--color_cat04_01);
}


.itm_list li .itm_link a {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 14rem;
  height: 4rem;
  font-size: 1.8rem;
  font-weight: 600;
  letter-spacing: .02em;
  color: #fff;
  transition: transform .3s;
}

.itm_list li .itm_link a:hover {
  transform: translate(.25rem, .25rem);
}

#UVCare .itm_list li .itm_link a {
  background: var(--color_cat01_01);
}

#BodyCare .itm_list li .itm_link a {
  background: var(--color_cat02_01);
}

#InnerCare .itm_list li .itm_link a {
  background: var(--color_cat03_01);
}

#InsectRepellent .itm_list li .itm_link a {
  background: var(--color_cat04_01);
}

.sec_btn_wrap {
  background: rgba(255, 255, 255, .7);
  padding-bottom: 10rem;
}

.sec_btn {
  position: relative;
  z-index: 1;
  width: fit-content;
  margin: 0 auto;
}

.sec_btn::before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: .8rem 0 0 .8rem;
  content: "";
  opacity: .2;
  transition: margin .3s;
}

.sec_btn:hover::before {
  margin: .4rem 0 0 .4rem;
}

#UVCare .sec_btn::before {
  background: var(--color_cat01_01);
}

#BodyCare .sec_btn::before {
  background: var(--color_cat02_01);
}

#InnerCare .sec_btn::before {
  background: var(--color_cat03_01);
}

#InsectRepellent .sec_btn::before {
  background: var(--color_cat04_01);
}

.sec_btn a {
  position: relative;
  display: grid;
  place-items: center;
  width: 52rem;
  height: 8rem;
  font-size: 2rem;
  font-weight: 600;
  letter-spacing: .02em;
  color: #ffff;
  transition: transform .3s;
}

.sec_btn a:hover {
  transform: translate(.4rem, .4rem);
}

#UVCare .sec_btn a {
  background: var(--color_cat01_01);
}

#BodyCare .sec_btn a {
  background: var(--color_cat02_01);
}

#InnerCare .sec_btn a {
  background: var(--color_cat03_01);
}

#InsectRepellent .sec_btn a {
  background: var(--color_cat04_01);
}

.sec_btn a::before {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 6rem;
  height: .1rem;
  border-radius: 0 .1rem .1rem 0;
  margin-right: -3rem;
  content: "";
  transition: margin .3s;
}

.sec_btn a::after {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%) rotate(35deg);
  transform-origin: center right;
  width: .8rem;
  height: .1rem;
  border-radius: 0 .1rem .1rem 0;
  margin-right: -3rem;
  content: "";
  transition: margin .3s, background-color .3s;
}

#UVCare .sec_btn a::before,
#UVCare .sec_btn a::after {
  background: #C5B253;
}

#BodyCare .sec_btn a::before,
#BodyCare .sec_btn a::after {
  background: #3381CF;
}

#InnerCare .sec_btn a::before,
#InnerCare .sec_btn a::after {
  background: #5FBDC9;
}

#InsectRepellent .sec_btn a::before,
#InsectRepellent .sec_btn a::after {
  background: #50B994;
}

.sec_btn a:hover::before,
.sec_btn a:hover::after {
  margin-right: -5rem;
}
/*-----------------------------itm*/

/*sumup button--------------------*/
.sumup_btn_wrap {
  padding-bottom: 13.5rem;
  background: rgba(255, 255, 255, .7);
}

.sumup_btn {
  position: relative;
  z-index: 1;
  width: fit-content;
  margin: 0 auto;
}

.sumup_btn::before {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: .8rem 0 0 .8rem;
  background: #000;
  opacity: .2;
  content: "";
  transition: margin .3s;
}

.sumup_btn:hover::before {
  margin: .4rem 0 0 .4rem;
}

.sumup_btn a {
  display: grid;
  place-items: center;
  width: 60rem;
  height: 8.5rem;
  background: #000;
  font-weight: 600;
  font-size: 2.4rem;
  color: #fff;
  transition: transform .3s;
}

.sumup_btn a:hover {
  transform: translate(.4rem, .4rem);
}

.sumup_btn a::before {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 6rem;
  height: .1rem;
  border-radius: 0 .1rem .1rem 0;
  margin-right: -3rem;
  background: #8E8E8E;
  content: "";
  transition: margin .3s;
}

.sumup_btn a::after {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%) rotate(35deg);
  transform-origin: center right;
  width: .8rem;
  height: .1rem;
  border-radius: 0 .1rem .1rem 0;
  margin-right: -3rem;
  background: #8E8E8E;
  content: "";
  transition: margin .3s, background-color .3s;
}

.sumup_btn a:hover::before,
.sumup_btn a:hover::after {
  margin-right: -5rem;
}
/*--------------------sumup button*/

/*fixed nav-----------------------*/
.anchor-link_wrap.fixed {
  position: fixed;
  z-index: 3;
  bottom: 0;
  width: 100%;
  margin-top: 0;
  padding: 1rem 0;
  background: rgba(255, 255, 255, .5);
  transform: translateY(100%);
  transition: transform .3s;
}

.anchor-link_wrap.fixed.active {
  transform: translateY(0);
}

.anchor-link_wrap.fixed ul li a {
  width: 18rem;
  height: 6rem;
  font-size: 1.5rem;
}

.anchor-link_wrap.fixed ul li a::before {
  display: none;
}

.anchor-link_wrap.fixed ul li a::after {
  width: 5rem;
  height: 5rem;
  margin-right: .3rem;
}

.anchor-link_wrap.fixed ul li a .txt_cursive {
  position: static;
  display: block;
  transform: translateX(0) rotate(-3deg);
  margin: 0 0 .5rem;
  font-size: 1.8rem;
}
/*-----------------------fixed nav*/


/*Smart phone---------------------------------------------*/
@media screen and  (max-width:768px) {
/*all----------------------------*/
.LP_page .only_pc {
  display: none;
}

#share {
  bottom: 0 !important;
  right: 0 !important;
  z-index: 5 !important;
  margin: 0 calc(15 * (100vw / 430)) calc(15 * (100vw / 430)) 0 !important;
  transition: margin .3s;
}

#share.move {
  margin-bottom: calc(70 * (100vw / 430)) !important;
}

.share-txt {
  margin: 0 !important;
  padding-bottom: calc(20 * (100vw / 430));
  background: rgba(255, 255, 255, .7);
}

/*----------------------------all*/

/*mv-----------------------------*/
.mv_area {
  padding: 0 0 calc(40 * (100vw / 430));
}

.main_ttl {
  width: auto;
  margin-bottom: calc(30 * (100vw / 430));
}

.main_lead {
  font-size: calc(14 * (100vw / 430));
}

.main_lead span:nth-of-type(n+2) {
  margin-top: calc(15 * (100vw / 430));
}

.anchor-link_wrap {
  margin-top: calc(60 * (100vw / 430));
}

.anchor-link_wrap h3 {
  width: calc(88 * (100vw / 430));
  margin: 0 auto calc(20 * (100vw / 430));
}

.anchor-link_wrap ul {
  flex-wrap: wrap;
  gap: calc(20 * (100vw / 430));
}

.anchor-link_wrap ul li::before {
  margin: calc(5 * (100vw / 430)) 0 0 calc(5 * (100vw / 430));
}

.anchor-link_wrap ul li:hover::before {
  margin: calc(2.5 * (100vw / 430)) 0 0 calc(2.5 * (100vw / 430));
}

.anchor-link_wrap ul li a {
  width: calc(185 * (100vw / 430));
  height: calc(68 * (100vw / 430));
  font-size: calc(17 * (100vw / 430));
}

.anchor-link_wrap ul li a:hover {
  transform: translate(calc(2.5 * (100vw / 430)), calc(2.5 * (100vw / 430)));
}

.anchor-link_wrap ul li a::before {
  border-width: calc(1 * (100vw / 430));
  width: calc(6 * (100vw / 430));
  height: calc(6 * (100vw / 430));
  margin-bottom: calc(10 * (100vw / 430));
}

.anchor-link_wrap ul li a:hover::before {
  margin-bottom: calc(5 * (100vw / 430));
}

.anchor-link_wrap ul li a::after {
  width: calc(50 * (100vw / 430));
  height: calc(50 * (100vw / 430));
}

.anchor-link_wrap ul li a .txt_cursive {
  margin-top: calc(-6 * (100vw / 430));
  font-size: calc(20 * (100vw / 430));
}

/*-----------------------------mv*/

/*itm-----------------------------*/
.each_sec {
  padding-top: calc(40 * (100vw / 430));
}

.each_sec::before {
  height: calc(100% - calc(120 * (100vw / 430)));
}

.sec_ttl {
  margin-bottom: calc(10 * (100vw / 430));
  padding-top: calc(47 * (100vw / 430));
  font-size: calc(26 * (100vw / 430));
}

.sec_ttl::before {
  width: calc(42 * (100vw / 430));
  height: calc(42 * (100vw / 430));
}

.sec_ttl .txt_cursive {
  margin-top: calc(10 * (100vw / 430));
  font-size: calc(20 * (100vw / 430));
}

.sec_lead {
  margin-bottom: calc(35 * (100vw / 430));
  font-size: calc(15 * (100vw / 430));
}

.itm_list_warp {
  padding-bottom: calc(40 * (100vw / 430));
}

.itm_list {
  display: block;
  width: calc(400 * (100vw / 430));
}

.itm_list li {
  position: relative;
  padding: calc(20 * (100vw / 430)) calc(15 * (100vw / 430)) calc(15 * (100vw / 430));
  background: rgba(255, 255, 255, .8);
}

.itm_list li:nth-of-type(n+2) {
  margin-top: calc(20 * (100vw / 430));
}

.itm_list li .itm_img_wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  width: calc(165 * (100vw / 430));
  margin: 0 0 calc(15 * (100vw / 430)) calc(15 * (100vw / 430));
}

.itm_list li .itm_feature {
  width: calc(80 * (100vw / 430));
  height: calc(80 * (100vw / 430));
  margin: calc(-55 * (100vw / 430)) 0 0 calc(-25 * (100vw / 430));
  font-size: calc(11 * (100vw / 430));
}

.itm_list li .itm_copy {
  margin-bottom: calc(12 * (100vw / 430));
  font-size: calc(16 * (100vw / 430));
  text-align: center;
}

.itm_list li .itm_name {
  margin-bottom: calc(15 * (100vw / 430));
  font-size: calc(13 * (100vw / 430));
}

.itm_list li .txt_wrap > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: calc(180 * (100vw / 430));
  height: calc(165 * (100vw / 430));
}

.itm_list li .txt_wrap > div > div {
  display: block;
}

.itm_list li .itm_price {
  margin-bottom: calc(15 * (100vw / 430));
  font-size: calc(20 * (100vw / 430));
}

.itm_list li .itm_price .txt_S{
  font-size: calc(10 * (100vw / 430));
}

.itm_list li .itm_link::before {
  margin: calc(5 * (100vw / 430)) 0 0 calc(5 * (100vw / 430));
}

.itm_list li .itm_link:hover::before {
  margin: calc(2.5 * (100vw / 430)) 0 0 calc(2.5 * (100vw / 430));
}

.itm_list li .itm_link a {
  width: calc(125 * (100vw / 430));
  height: calc(30 * (100vw / 430));
  font-size: calc(15 * (100vw / 430));
}

.itm_list li .itm_link a:hover {
  transform: translate(calc(2.5 * (100vw / 430)), calc(2.5 * (100vw / 430)));
}

.itm_list li .itm_link a span {
  padding-top: calc(2 * (100vw / 430));
}

.sec_btn_wrap {
  background: rgba(255, 255, 255, .7);
  padding-bottom: calc(60 * (100vw / 430));
}

.sec_btn::before {
  margin: calc(8 * (100vw / 430)) 0 0 calc(8 * (100vw / 430));
}

.sec_btn:hover::before {
  margin: calc(4 * (100vw / 430)) 0 0 calc(4 * (100vw / 430));
}

.sec_btn a {
  width: calc(360 * (100vw / 430));
  height: calc(60 * (100vw / 430));
  font-size: calc(15 * (100vw / 430));
}

.sec_btn a:hover {
  transform: translate(calc(4 * (100vw / 430)), calc(4 * (100vw / 430)));
}

.sec_btn a::before {
  width: calc(34 * (100vw / 430));
  height: calc(1 * (100vw / 430));
  border-radius: 0 calc(1 * (100vw / 430)) calc(1 * (100vw / 430)) 0;
  margin-right: calc(-17 * (100vw / 430));
}

.sec_btn a::after {
  width: calc(8 * (100vw / 430));
  height: calc(1 * (100vw / 430));
  border-radius: 0 calc(1 * (100vw / 430)) calc(1 * (100vw / 430)) 0;
  margin-right: calc(-17 * (100vw / 430));
}

.sec_btn a:hover::before,
.sec_btn a:hover::after {
  margin-right: calc(-22 * (100vw / 430));
}
/*-----------------------------itm*/

/*sumup button--------------------*/
.sumup_btn_wrap {
  padding-bottom: calc(80 * (100vw / 430));
}

.sumup_btn::before {
  margin: calc(8 * (100vw / 430)) 0 0 calc(8 * (100vw / 430));
}

.sumup_btn:hover::before {
  margin: calc(4 * (100vw / 430)) 0 0 calc(4 * (100vw / 430));
}

.sumup_btn a {
  width: calc(380 * (100vw / 430));
  height: calc(65 * (100vw / 430));
  font-size: calc(18 * (100vw / 430));
}

.sumup_btn a:hover {
  transform: translate(calc(4 * (100vw / 430)), calc(4 * (100vw / 430)));
}

.sumup_btn a::before {
  width: calc(34 * (100vw / 430));
  height: calc(1 * (100vw / 430));
  border-radius: 0 calc(1 * (100vw / 430)) calc(1 * (100vw / 430)) 0;
  margin-right: calc(-17 * (100vw / 430));
}

.sumup_btn a::after {
  width: calc(8 * (100vw / 430));
  height: calc(1 * (100vw / 430));
  border-radius: 0 calc(1 * (100vw / 430)) calc(1 * (100vw / 430)) 0;
  margin-right: calc(-17 * (100vw / 430));
}

.sumup_btn a:hover::before,
.sumup_btn a:hover::after {
  margin-right: calc(-20 * (100vw / 430));
}
/*--------------------sumup button*/

/*fixed nav-----------------------*/
.anchor-link_wrap.fixed {
  padding: 0;
}

.anchor-link_wrap.fixed ul {
  gap: 0;
}

.anchor-link_wrap.fixed ul li {
  width: calc(100% / 4);
}

.anchor-link_wrap.fixed ul li::before {
  display: none;
}

.anchor-link_wrap.fixed ul li a {
  width: 100%;
  height: calc(50 * (100vw / 430));
  font-size: calc(12 * (100vw / 430));
}

.anchor-link_wrap.fixed ul li a:hover {
  transform: translate(0);
}

.anchor-link_wrap.fixed ul li a::after {
  width: calc(38 * (100vw / 430));
  height: calc(38 * (100vw / 430));
  margin-right: calc(3 * (100vw / 430));
}

.anchor-link_wrap.fixed ul li a .txt_cursive {
  margin: 0 0 calc(5 * (100vw / 430));
  font-size: calc(13 * (100vw / 430));
}
/*-----------------------fixed nav*/
}

/*---------------------------------------------Smart phone*/

/*PC------------------------------------------------------*/
@media screen and  (min-width:769px) {
  .only_sp {
    display: none;
  }

  #header_bottom .inner {
    width: 100%;
  }
}
/*------------------------------------------------------PC*/

/*レスポンシブ＆タブレット対応-------------------------------*/
@media screen and (max-width: 1400px){
  html {
    font-size: calc(10 * (100vw / 1400));
  }
}
/*-------------------------------レスポンシブ＆タブレット対応*/
