@charset "utf-8";

main { max-width: 800px; margin: 0 auto;}
section { width: 100%; height: auto; text-align: center;}
h3 { font-family: 'new-atten', sans-serif; font-weight: 400; font-size: 33px; letter-spacing: 0.1em; text-align: center;}
h3:after { display: block; content: ""; width: 40px; height: 1px; background-color: #000; margin: 27px auto 0;}
img { width: 66.7%; height: auto;}
.green_line { background: linear-gradient(transparent 60%, #bfd794 50%);}
.white_line { background: linear-gradient(transparent 60%, #fff 50%);}
.btns { width: 80%; height: 87px; background: url(../images/icn_01.png) no-repeat 90% center #eb6100; border-radius: 65px; margin: 0 auto; color: #fff; line-height: 87px; font-size: 31px; background-size: 2%;}
.btns a { display: block; color: #fff; line-height: 87px; }

.custom-width {
  width: 1077px !important;
  height: auto;
}

#fv img { width: 100%; height: auto;}
#fv2 img { width: 100%; height: auto;}
#fv3 img { width: 100%; height: auto;}
#fv4 img { width: 100%; height: auto;}
#fv5 img { width: 100%; height: auto;}
#fv6 img { width: 100%; height: auto;}
#fv7 img { width: 100%; height: auto;}
#fv8 img { width: 100%; height: auto;}
#fv9 img { width: 100%; height: auto;}
#fv10 img { width: 100%; height: auto;}
#fv11 img { width: 100%; height: auto;}

#concept_01 { background: url(../images/bg_01.jpg) no-repeat center center; background-size: cover; padding: 87px 0 82px;}
#concept_01 h3 { margin-bottom: 33px;}
#concept_01 p { margin: -13px auto 53px; line-height: 2; letter-spacing: 0.1em;}
#concept_01 img { width: 666px; height: auto;}

#concept_02 { background: url(../images/bg_02.jpg) no-repeat center center; background-size: cover; padding: 51px 0 388px;}
#concept_02 h4 { margin-bottom: 20px;}


#lineup_wrapper {
  background: url(../images/bg_24.jpg) repeat-y center top;
  background-size: auto;
  padding: 0;
}

#lineup_01, #lineup_02, #lineup_03, #lineup_04 {
  background: none !important;
  padding: 60px 0;
}

#lineup_01 h3,
#lineup_02 h3,
#lineup_03 h3,
#lineup_04 h3 {
  text-align: center;
  font-size: 28px;
  margin-bottom: 20px;
  color: #333;
}

.lineup {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  max-width: 1000px;
  margin: 0 auto;
  gap: 20px;
}

.lineup img {
  width: 48%;
  height: auto;
}



/*
#lineup_01 { background: url(../images/bg_03_1.jpg) no-repeat center center; background-size: cover; padding: 87px 0 75px;}
#lineup_01 h3 { margin-bottom: 47px;}
#lineup_01 .lineup { display: flex; justify-content: space-between; margin: 0 auto; align-items: flex-end;}
#lineup_02 { background: url(../images/bg_03_1.jpg) no-repeat center center; background-size: cover; padding: 127px 0 171px;}
#lineup_02 .lineup { display: flex; justify-content: space-between; margin: 0 auto; align-items: flex-end;}

#lineup_03 {
  background: url(../images/bg_03_1.jpg) no-repeat center center;
  background-size: cover;
  padding: 127px 0 171px;
}
#lineup_03 .lineup {
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
  align-items: flex-end;
}

#lineup_04 {
  background: url(../images/bg_03_1.jpg) no-repeat center center;
  background-size: cover;
  padding: 127px 0 171px;
}
#lineup_04 .lineup {
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
  align-items: flex-end;
}

*/

#feature_01 { background: url(../images/bg_04.jpg) no-repeat center center; background-size: cover; padding: 86px 0 0;}
#feature_01 h3 { margin-bottom: 37px;}
#feature_01 p { margin: 40px 0 91px; line-height: 1.8; letter-spacing: 0.1em;}
#feature_01 .bottom { width: 100%; height: auto;}

#feature_02 { background: url(../images/bg_05.jpg) no-repeat center center; background-size: cover; padding: 87px 0 41px;}
#feature_02 h3 { margin-bottom: 2px;}
#feature_02 h4 { margin-bottom: 26px;}
#feature_02 p { margin-bottom: 61px;line-height: 1.8; letter-spacing: 0.1em;}
#feature_02 .bottom { width: 81%; height: auto;}

#developer_01 { background: url(../images/bg_06_1.jpg) no-repeat center center; background-size: cover; padding: 67px 0 37px;}
#developer_01 h3 { margin-bottom: 23px; color: #fff;}
#developer_01 h3:after { background-color: #fff;}
#developer_01 h4 { color: #fff; font-size: 36px; line-height: 1.667; margin: -12px 0 25px;}
#developer_01 h4 .dev_under { text-decoration: underline;}
#developer_01 h4 .dev_br { display: block; margin-top: 19px;}
#developer_01 .developer { background: url(../images/pic_16.jpg) no-repeat center center; background-size: cover; width: 90%; height: auto; margin: 0 auto; padding: 37px 68px 43px;}
#developer_01 .developer p { font-size: 17px; line-height: 1.769; margin-top: -7px; text-align: start;}
#developer_01 .pro { display: flex; justify-content: center; font-weight: 500px; margin-bottom: 30px;}
#developer_01 .pro img { width: 25%;}
#developer_01 .pro p { font-size: 27px; font-family: yu-mincho-pr6n, sans-serif; font-weight: 400; text-align: start; margin-left: 28px;}
#developer_01 .pro .professor { font-size: 40px; color: #689d2a; font-family: beloved-script, sans-serif; font-weight: 400; text-align: start;}
#developer_01 .pro p span { font-size: 19px;}

#developer_02 { background: url(../images/bg_06_2.jpg) no-repeat center center; background-size: cover; padding: 93px 0 112px;}
#developer_02 .developer { background: url(../images/pic_16.jpg) no-repeat center center; background-size: cover; width: 90%; height: auto; margin: 0 auto 93px; padding: 36px 68px 43px;}
#developer_02 .developer p { font-size: 17px; line-height: 1.769; margin-top: -7px; text-align: start;}
#developer_02 .pro { display: flex; justify-content: center; font-weight: 500px; margin-bottom: 30px;}
#developer_02 .pro img { width: 25%;}
#developer_02 .pro p { font-size: 27px; font-family: yu-mincho-pr6n, sans-serif; font-weight: 400; text-align: start; margin-left: 28px;}
#developer_02 .pro .professor { font-size: 40px; color: #689d2a; font-family: beloved-script, sans-serif; font-weight: 400; text-align: start;}
#developer_02 .pro p span { font-size: 19px;}

#shampoo_01 { background: url(../images/bg_07.jpg) no-repeat center center; background-size: cover; padding: 67px 0 143px;}
#shampoo_01 h3 { margin-bottom: 91px;}
#shampoo_01 h4 { margin-bottom: 41px;}
#shampoo_01 img { width: 52%;}
#shampoo_01 p { font-size: 33px; line-height: 1.5; margin-top: -17px;}
#shampoo_01 .white { background: linear-gradient(transparent 0, #fff 0);line-height: 1.5;}
#shampoo_01 .orange { color: #eb6100; text-decoration: underline;line-height: 1.5;}

#shampoo_02 { background: url(../images/bg_08.jpg) no-repeat center center; background-size: cover; padding: 73px 0 141px;}
#shampoo_02 h3 { margin-bottom: 80px;}
#shampoo_02 h4 { margin-bottom: 41px;}
#shampoo_02 img { width: 74%;}
#shampoo_02 p { font-size: 33px; line-height: 1.8; margin-top: -17px;}
#shampoo_02 .white { background: linear-gradient(transparent 0, #fff 0);line-height: 1.5;}
#shampoo_02 .orange { color: #eb6100; text-decoration: underline;line-height: 1.5;}

#dry_shampoo_dog { background: url(../images/bg_09.jpg) no-repeat center center; background-size: cover; padding: 37px 0 40px;}
#dry_shampoo_dog h4 { margin-bottom: -11px;}
#dry_shampoo_dog .item { display: flex; align-items: center; margin-bottom: 370px;}
#dry_shampoo_dog .type { background: url(../images/pic_22.png) no-repeat; background-size: cover; width: 162px; height: 167px; margin-left: 33px;}
#dry_shampoo_dog .item p { font-size: 30px; line-height: 1.444; margin-top: -7px; margin-left: -27px;}

#dry_shampoo_cat { background: url(../images/bg_10.jpg) no-repeat center center; background-size: cover; padding: 37px 0 41px;}
#dry_shampoo_cat h4 { margin-bottom: -11px;}
#dry_shampoo_cat .item { display: flex; align-items: center; margin-bottom: 370px;}
#dry_shampoo_cat .type { background: url(../images/pic_22.png) no-repeat; background-size: cover; width: 163px; height: 167px; margin-left: 33px;}
#dry_shampoo_cat .item p { font-size: 30px; line-height: 1.444; margin-top: -7px; margin-left: -27px;}

#shampoo_scene { background: url(../images/bg_11.jpg) no-repeat center center; background-size: cover; padding: 60px 0 61px;}
#shampoo_scene h3 { margin-bottom: 20px;}
#shampoo_scene h4 { font-size: 30px; margin-bottom: 33px;}
#shampoo_scene .sence_box { width: 90%; margin: 0 auto;}
#shampoo_scene .sence_box li { background: rgb(255,255,255,0.9); height: 67px; line-height: 67px; margin-bottom: 13px;}
#shampoo_scene .sence_box .dry_box { display: flex; justify-content: space-between;}
#shampoo_scene .sence_box .dry_box li { width: 49%;}

#movie { background: url(../images/bg_12.jpg) no-repeat center center; background-size: cover; padding: 67px 0 0;}
#movie h3 { margin-bottom: 40px;}
#movie h4 { margin-bottom: 47px;}
#movie iframe { width: 100%; height: 48%;}
/*
#petwash { background: url(../images/bg_13.jpg) no-repeat center center; background-size: cover; padding: 37px 0 55px;}
#petwash h4 { margin-bottom: 32px;}
#petwash .item { display: flex; align-items: center; margin-bottom: 360px;}
#petwash .type { background: url(../images/pic_26.png) no-repeat; background-size: cover; width: 127px; height: 127px; margin-left: 67px;}
#petwash .item p { font-size: 30px; line-height: 1.444; margin-top: -10px; margin-left: 20px; text-align: start;}

#petwash_scene { background: url(../images/bg_14.jpg) no-repeat center center; background-size: cover; padding: 73px 0 352px;}
#petwash_scene h3 { margin-bottom: 21px; color: #fff;}
#petwash_scene h3:after { background-color: #fff;}
#petwash_scene h4 { font-size: 30px; margin-bottom: 50px; color: #fff;}
#petwash_scene .sence_box { width: 90%; margin: 0 auto;}
#petwash_scene .sence_box li { background: rgb(255,255,255,0.9); height: 67px; line-height: 67px; margin-bottom: 13px;}
*/
#ear_clean { background: url(../images/bg_15.jpg) no-repeat center center; background-size: cover; padding: 37px 0 55px;}
#ear_clean h4 { margin-bottom: 32px;}
#ear_clean h4 img { width: 50%;}
#ear_clean .item { display: flex; align-items: center; margin-bottom: 380px;}
#ear_clean .type { background: url(../images/pic_26.png) no-repeat; background-size: cover; width: 127px; height: 127px; margin-left: 67px;}
#ear_clean .item p { font-size: 30px; line-height: 1.556; margin-top: -17px; margin-left: 20px; text-align: start;}

#ear_clean_scene { background: url(../images/bg_16.jpg) no-repeat center center; background-size: cover; padding: 73px 0 129px;}
#ear_clean_scene h3 { margin-bottom: 21px;}
#ear_clean_scene h4 { font-size: 30px; margin-bottom: 50px;}
#ear_clean_scene .sence_box { width: 90%; margin: 0 auto;}
#ear_clean_scene .sence_box li { background: rgb(255,255,255,0.9); height: 67px; line-height: 67px; margin-bottom: 13px;}

#paws_care { background: url(../images/bg_17.jpg) no-repeat center center; background-size: cover; padding: 37px 0 55px;}
#paws_care h4 { margin-bottom: 25px;}
#paws_care h4 img { width: 36%;}
#paws_care .item { display: flex; align-items: center; margin-bottom: 350px;}
#paws_care .type { background: url(../images/pic_30.png) no-repeat; background-size: cover; width: 129px; height: 136px; margin-left: 88px;}
#paws_care .item p { font-size: 30px; line-height: 1.444; margin-left: 27px; text-align: start;}

#paws_care_scene { background: url(../images/bg_18.jpg) no-repeat center center; background-size: cover; padding: 89px 0 169px;}
#paws_care_scene h3 { margin-bottom: 20px;}
#paws_care_scene h4 { font-size: 30px; margin-bottom: 50px;}
#paws_care_scene .sence_box { width: 90%; margin: 0 auto;}
#paws_care_scene .sence_box li { background: rgb(255,255,255,0.9); height: 67px; line-height: 67px; margin-bottom: 13px;}

#cleaning_form { background: url(../images/bg_19.jpg) no-repeat center center; background-size: cover; padding: 37px 0 55px;}
#cleaning_form h4 { margin-bottom: 13px;}
#cleaning_form .item { display: flex; align-items: center; margin-bottom: 329px;}
#cleaning_form .type { background: url(../images/pic_22.png) no-repeat; background-size: cover; width: 163px; height: 167px; margin-left: 33px;}
#cleaning_form .item p { font-size: 30px; line-height: 1.444; margin-top: -20px; margin-left: -20px; text-align: start;}

#cleaning_form_scene { background: url(../images/bg_20.jpg) no-repeat center center; background-size: cover; padding: 127px 0 131px;}
#cleaning_form_scene h3 { margin-bottom: 21px;}
#cleaning_form_scene h4 { font-size: 30px; margin-bottom: 50px;}
#cleaning_form_scene .sence_box { width: 90%; margin: 0 auto;}
#cleaning_form_scene .sence_box li { background: rgb(255,255,255,0.9); height: 67px; line-height: 67px; margin-bottom: 13px;}

.modal img {
  width: 70% !important;

}

.modal-content {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9); /* 半透明の黒 */
  z-index: 998;
  display: none;
}

.modal {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}


@media(max-width:600px){
 .modal{
width:95%
}

.modal img {
  width: 100% !important;

}

}

.modal2 img {
  width: 70% !important;

}

.modal-content2 {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close2 {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close2:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay2 {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9); /* 半透明の黒 */
  z-index: 998;
  display: none;
}

.modal2 {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}

@media(max-width:600px){
 .modal2{
width:95%
}

.modal2 img {
  width: 100% !important;

}

}


.modal3 img {
  width: 70% !important;

}

.modal-content3 {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close3 {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close3:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay3 {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 999;
}


.modal3 {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}


@media(max-width:600px){
 .modal3{
width:95%
}

.modal3 img {
  width: 100% !important;

}

}


.modal4 img {
  width: 70% !important;

}

.modal-content4 {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close4 {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close4:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay4 {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 999;
}


.modal4 {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}

.modal5 img {
  width: 70% !important;

}

.modal-content5 {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close5 {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close5:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay5 {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 999;
}


.modal5 {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}


@media(max-width:600px){
 .modal5{
width:95%
}

.modal5 img {
  width: 100% !important;

}

}

.modal6 img {
  width: 70% !important;

}

.modal-content6 {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close6 {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close6:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay6 {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 999;
}


.modal6 {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}


@media(max-width:600px){
 .modal6{
width:95%
}

.modal6 img {
  width: 100% !important;

}

}

.modal7 img {
  width: 70% !important;

}

.modal-content7 {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close7 {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close7:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay7 {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 999;
}


.modal7 {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}


@media(max-width:600px){
 .modal7{
width:95%
}

.modal7 img {
  width: 100% !important;

}

}

.modal8 img {
  width: 70% !important;

}

.modal-content8 {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close8 {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close8:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay8 {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 999;
}


.modal8 {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}


@media(max-width:600px){
 .modal8{
width:95%
}

.modal8 img {
  width: 100% !important;

}

}

.modal9 img {
  width: 70% !important;

}

.modal-content9 {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close9 {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close9:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay9 {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 999;
}


.modal9 {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}


@media(max-width:600px){
 .modal9{
width:95%
}

.modal9 img {
  width: 100% !important;

}

}

.modal10 img {
  width: 70% !important;

}

.modal-content10 {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close10 {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close10:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay10 {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 999;
}


.modal10 {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}


@media(max-width:600px){
 .modal10{
width:95%
}

.modal10 img {
  width: 100% !important;

}

}

#pet_fair_asia { background: url(../images/bg_21.jpg) no-repeat center center; background-size: cover; padding: 60px 0 61px;}
#pet_fair_asia h4 { margin-bottom: 8px; margin-left: 38px;}
#pet_fair_asia img { width: 96%;}
#pet_fair_asia p { font-size: 31px; line-height: 1.556; margin: -8px 0 30px; text-align: start; letter-spacing: 0.06em;}
#pet_fair_asia p:last-child { margin-bottom: 0;}
#pet_fair_asia p sup { font-size: 17px;}
#pet_fair_asia span { font-size: 20px; text-align: start; letter-spacing: 0.05em;}

#recommend { background: url(../images/bg_22.jpg) no-repeat center center; background-size: cover; padding: 67px 0 54px;}
#recommend h3 { margin-bottom: 20px; color: #fff;}
#recommend h3:after {background-color: #fff;}
#recommend h4 { font-size: 30px; margin-bottom: 41px; color: #fff;}
#recommend img { width: 31%;}
#recommend .reco { background: #fff no-repeat; width: 83%; height: auto; margin: 33px auto 0; padding: 26px 40px 31px;}
#recommend .reco p { font-size: 17px; line-height: 1.769; margin-top: -7px; text-align: left;}
#recommend .reco span { font-size: 19px; margin-left: 7px;}
#recommend .reco .docter { font-size: 40px; color: #689d2a; font-family: beloved-script, sans-serif; font-weight: 400; margin-right: 13px;}
#recommend .reco .name { font-size: 27px; font-family: yu-mincho-pr6n, sans-serif; font-weight: 400; margin: 0 0 20px; text-align: center;}

#gallery { background: url(../images/bg_23.jpg) no-repeat center center; background-size: cover; padding: 47px 0 43px;}
#gallery h3 { margin-bottom: 21px;}
#gallery ul { display: flex; flex-wrap: wrap; justify-content: space-between; width: 80%; margin: 0 auto;}
#gallery ul li { margin-bottom: 11px;}
#gallery ul li { width: 32%; }
#gallery ul li img { width: 100%; height: auto;}

#contact { background: url(../images/bg_24.jpg) no-repeat center center; background-size: cover; height: auto; padding: 73px 0 87px;}

#contact h3 { margin-bottom: 27px;}
#contact h4 { margin-bottom: 42px; font-size: 27px;}
#contact table tr { }
#contact table th {  text-align: start; font-size: 27px; padding-bottom: 20px;}
#contact table td { padding: 0 0 18px; width: 100%;}
#contact table td textarea { border: none; padding: 25px 41px;}
#contact table td input[type="text"] { padding: 25px 41px; width: 100%; border: none;}
#contact table .Required { color: #eb6100; margin-left: 17x;}
#contact input[type="submit"] { width: 100%; height: 87px; background: url(../images/icn_01.png) no-repeat 90% center #eb6100; border-radius: 65px; margin: 0 auto; display: block; color: #fff; line-height: 87px; background-size: 2%;}



#confirm { padding: 100px 0; text-align: center; border-bottom: 1px solid #ededed;}
#confirm h4 { padding: 50px 0 ; }
#confirm h2 { padding:  0 0 50px; }
#confirm p { text-align: left; }
#confirm p.caution { line-height: 150%; text-align: center; padding: 0 0 30px;}

#confirm table { width: 100%; }
#confirm table th { background: #ededed; display: block; text-align: left; padding: 4%;}
#confirm table td  { display: block; padding: 5%;} 
.forward_btn input[type="submit"] { width: 100%; height: 87px; background: url(../images/icn_01.png) no-repeat 90% center #eb6100; border-radius: 65px; margin: 0 auto; display: block; color: #fff; line-height: 87px; background-size: 2%; }
.back_btn { background: #c9c9c9 ;border-radius: 65px; margin-bottom: 20px; }


#error { padding: 100px 0; text-align: center; border-bottom: 1px solid #ededed; }
#error h4 {  padding: 30px 0 50px; }
#error h2 { padding:  0 0 50px; }
#error p span { display: block; padding: 20px 0 0; }
#error p.caution { line-height: 150%; }
#error p.alert { text-align: center; line-height: 150%; padding: 20px 0 50px;}

#thanks { padding: 100px 0; text-align: center;}
#thanks h2 { padding:  0 0 50px; }
#thanks p.caution { line-height: 150%; padding: 0 0 20px;}
#thanks small { font-size: 16px; line-height: 150%;}
#thanks .top_btn { padding: 50px 0; }
#thanks .top_btn a { display: block; display: inline-block; background:#838383; color: #fff; line-height: 60px; width: 300px; font-size: 20px; }


/* モーダルCSS */
.modalArea {  display: none;  position: fixed;  z-index: 10; /*サイトによってここの数値は調整 */  top: 0;  left: 0;  width: 100%;  height: 100%;}
.modalBg {  width: 100%;  height: 100%;  background-color: rgba(30,30,30,0.9);}
.modalWrapper { position: absolute;  top: 50%;  left: 50%;  transform:translate(-50%,-50%);  width: 100%;  max-width: 700px; padding: 70px 50px;  background-color: #fff;}
.modalWrapper_s { background: url(../images/modal_bg.jpg) no-repeat; background-size: cover; position: absolute;  top: 50%;  left: 50%;  transform:translate(-50%,-50%);  width: 100%;  max-width: 700px; padding: 70px 50px;  background-color: #fff;}
.closeModal {  position: absolute;  top: 0.5rem;  right: 1rem;  cursor: pointer; color: #fff;}
#modalArea h3 { color: #fff; }
#modalArea h3:after { color: #fff; background: #fff;}
#modalArea p { font-size: 16px; line-height: 180%; text-align: left; padding: 30px 0 0 ;  color: #fff;}


#modalec .modalWrapper { background: transparent;}
#modalec .modalWrapper h2 { font-size: 30px; line-height: 150%;  color: #fff; padding: 0 0 50px;}
#modalec .modalWrapper p { padding-bottom: 20px; }
#modalec .modalWrapper p img { width: 100%; height: auto; }

/* ----------------------------- mobile ------------------------------- */
@media only screen and (max-width: 768px) {
	
body { font-size: 16px; }
main { max-width: inherit; margin: 0 auto;}
section { width: 100%; height: auto; text-align: center;}

h3 { font-family: 'new-atten', sans-serif; font-weight: 400; font-size: 16px; letter-spacing: 0.1em; text-align: center;}
h3:after { display: block; content: ""; width: 20px; height: 1px; background-color: #000; margin: 16px auto 0; }

img { width: 100%; height: auto;}

.green_line { background: linear-gradient(transparent 60%, #bfd794 50%);}

.white_line { background: linear-gradient(transparent 60%, #fff 50%);}

.btns { width: 80%; height: 40px; background: url(../images/icn_01.png) no-repeat 90% center #eb6100; border-radius: 22px; margin: 0 auto; color: #fff; line-height: 40px; font-size: 14px; background-size: 2%;}

.btns a { display: block; color: #fff; line-height: 40px; }



#fv img { width: 100%; height: auto;}

#concept_01 { background: url(../images/bg_01.jpg) no-repeat center center; background-size: cover; padding: 40px 0 40px;}
#concept_01 h3 { margin-bottom: 13px;}
#concept_01 p { margin: 0 auto 25px; line-height: 2; letter-spacing: 0.1em; font-size: 12px;}
#concept_01 .mar { margin-bottom: 20px;}
#concept_01 img { width: 85%; height: auto; }


#concept_02 { background: url(../images/bg_02.jpg) no-repeat center center; background-size: cover; padding: 22px 0 180px; text-align: center;}
#concept_02 h4 { width: 85%; height: auto; margin: 0 auto 10px;}
#concept_02 img.point { width: 70%; height: auto; }

/*

#lineup_01 { background: url(../images/bg_03_1.jpg) no-repeat center center; background-size: cover; padding: 40px 0 ;}
#lineup_01 h3 { margin-bottom: 20px;}
.lineup { display: flex; justify-content: space-between; margin: 0 auto; align-items: flex-end;}
#lineup_01 .lineup img { width: 80%; height: auto; }
#lineup_02 { background: url(../images/bg_03_1.jpg) no-repeat center center; background-size: cover; padding: 50px 0 75px;}
#lineup_02 .lineup img { width: 80%; height: auto; }
#lineup_03 { background: url(../images/bg_03_1.jpg) no-repeat center center; background-size: cover; padding: 50px 0 75px;}
#lineup_03 .lineup img { width: 80%; height: auto; }
#lineup_04 { background: url(../images/bg_03_1.jpg) no-repeat center center; background-size: cover; padding: 50px 0 75px;}
#lineup_04 .lineup img { width: 80%; height: auto; }
*/
#feature_01 { background: url(../images/bg_04.jpg) no-repeat center center; background-size: cover; padding: 40px 0 0;}


#feature_01 h3 { margin-bottom: 20px;}
#feature_01 p { margin: 20px 0 40px; line-height: 1.8; letter-spacing: 0.1em;}
#feature_01 img { height: auto; width: 80%; }


#feature_02 { background: url(../images/bg_05.jpg) no-repeat center center; background-size: cover; padding: 40px 0;}
#feature_02 h3 { margin-bottom: 2px;}
#feature_02 h4 { margin-bottom: 10px;}
#feature_02 h4 img { width: 50%; height: auto; }
#feature_02 p { margin-bottom: 20px;line-height: 1.8; letter-spacing: 0.1em;}
#feature_02 .bottom { width: 85%; height: auto;}


#developer_01 { background: url(../images/bg_06_1.jpg) no-repeat center center; background-size: cover; padding: 40px 0;}
#developer_01 h3 { margin-bottom: 23px; color: #fff;}
#developer_01 h3:after { background-color: #fff;}
#developer_01 h4 { color: #fff; font-size: 16px; line-height: 1.667; margin: -12px 0 25px;}
#developer_01 h4 .dev_under { text-decoration: underline;}
#developer_01 h4 .dev_br { display: block; margin-top: 5px;}
#developer_01 h4 .year30 { width: 60%; height: auto; }

#developer_01 .developer { background: url(../images/pic_16.jpg) no-repeat center center; background-size: 100% 100%; width: 90%; height: auto; margin: 0 auto; padding: 20px 25px 25px;}
#developer_01 .developer p { font-size: 10px; line-height: 1.769; margin-top: -7px; text-align: start;}
#developer_01 .pro { display: flex; justify-content: center; align-items: center; font-weight: 500px; margin-bottom: 15px;}
#developer_01 .pro img { width: 80px; height: auto;}
#developer_01 .pro p { font-size: 12px; font-family: yu-mincho-pr6n, sans-serif; font-weight: 400; text-align: start; margin-left: 28px;}
#developer_01 .pro .professor { font-size: 18px; color: #689d2a; font-family: beloved-script, sans-serif; font-weight: 400; text-align: start;}
#developer_01 .pro p span { font-size: 10px;}

#developer_02 { background: url(../images/bg_06_2.jpg) no-repeat center center; background-size: cover; padding: 0 0 40px;}
#developer_02 .developer { background: url(../images/pic_16.jpg) no-repeat center center; background-size: 100% 100%; width: 90%; height: auto; margin: 0 auto 40px; padding: 20px 25px 25px;}
#developer_02 .developer p { font-size: 10px; line-height: 1.769; margin-top: -7px; text-align: start;}
#developer_02 .pro { display: flex; justify-content: center; align-items: center; font-weight: 500px; margin-bottom: 15px;}
#developer_02 .pro img { width: 80px; height: auto;}
#developer_02 .pro p { font-size: 12px; font-family: yu-mincho-pr6n, sans-serif; font-weight: 400; text-align: start; margin-left: 28px;}
#developer_02 .pro .professor { font-size: 18px; color: #689d2a; font-family: beloved-script, sans-serif; font-weight: 400; text-align: start;}
#developer_02 .pro p span { font-size: 10px;}


#shampoo_01 { background: url(../images/bg_07.jpg) no-repeat center center; background-size: cover; padding: 8% 0; box-sizing: border-box; height: 100vw;}
#shampoo_01 h3 { margin-bottom: 10%;}
#shampoo_01 img { width: 40%; height: auto; }
#shampoo_01 h4 { margin-bottom: 30px;}
#shampoo_01 p { font-size: 14px; line-height: 1.5; margin-top: -17px;}
#shampoo_01 .white { background: linear-gradient(transparent 0, #fff 0);line-height: 1.5;}
#shampoo_01 .orange { color: #eb6100; text-decoration: underline;line-height: 1.5;}

#shampoo_02 { background: url(../images/bg_08.jpg) no-repeat center center; background-size: cover; padding: 8% 0; height: 100vw;}
#shampoo_02 h3 { margin-bottom: 10%;}
#shampoo_02 h4 { margin-bottom: 41px;}
#shampoo_02 img { width: 60%;}
#shampoo_02 p { font-size: 15px; line-height: 1.8; margin-top: -17px;}
#shampoo_02 .white { background: linear-gradient(transparent 0, #fff 0);line-height: 1.5;}
#shampoo_02 .orange { color: #eb6100; text-decoration: underline;line-height: 1.5;}

#dry_shampoo_dog { background: url(../images/bg_09.jpg) no-repeat center center; background-size: cover; padding: 20px 0 ;}
#dry_shampoo_dog h4 { margin-bottom: 1px;}
#dry_shampoo_dog h4 img { height: 53px; width: auto; }
#dry_shampoo_dog .item { display: flex; align-items: center; text-align: left; margin-bottom: 55%; justify-content: center;}
#dry_shampoo_dog .type { background: url(../images/pic_22.png) no-repeat; background-size: 56px auto; width: 82px; height: 66px; margin-left: 0;}
#dry_shampoo_dog .item p { font-size: 14px; line-height: 1.444; margin-top: -7px; margin-left: -27px; text-align: left;}

#dry_shampoo_cat { background: url(../images/bg_10.jpg) no-repeat center center; background-size: cover; padding: 20px 0 ;}
#dry_shampoo_cat h4 { margin-bottom: 1px;}
#dry_shampoo_cat h4 img { height: 53px; width: auto; }
#dry_shampoo_cat .item { display: flex; align-items: center; text-align: left; margin-bottom: 55%; justify-content: center;}
#dry_shampoo_cat .type { background: url(../images/pic_22.png) no-repeat; background-size: 60px auto; width: 82px; height: 66px; margin-left: 0;}
#dry_shampoo_cat .item p { font-size: 14px; line-height: 1.444; margin-top: -7px; margin-left: -27px; text-align: left;}

#shampoo_scene { background: url(../images/bg_11.jpg) no-repeat center center; background-size: cover; padding: 40px 0 ;}
#shampoo_scene h3 { margin-bottom: 10px;}
#shampoo_scene h4 { font-size: 14px; margin-bottom: 20px;}
#shampoo_scene .sence_box { width: 90%; margin: 0 auto;}
#shampoo_scene .sence_box li { background: rgb(255,255,255,0.9); height: 30px; line-height: 30px; margin-bottom: 5px; font-size: 12px;}
#shampoo_scene .sence_box .dry_box { display: flex; justify-content: space-between;}
#shampoo_scene .sence_box .dry_box li { width: 49%;}

#movie { background: url(../images/bg_12.jpg) no-repeat center center; background-size: cover; padding: 40px 0 0;}
#movie h3 { margin-bottom: 20px;}
#movie h4 { margin-bottom: 20px;}
#movie h4 img { width: 80%; }
#movie iframe { width: 100%; height: 40%;}
#movie .youtube { width: 100%; aspect-ratio: 16 / 9; }
#movie .youtube iframe {  width: 100%; height: 100%; }
/*
#petwash { background: url(../images/bg_13.jpg) no-repeat center center; background-size: cover; padding: 20px 0 25px;}
#petwash h4 { margin-bottom: 10px;}
#petwash h4 img { height: 53px; width: auto; }
#petwash .item { display: flex; align-items: center; justify-content: center;  margin-bottom: 48%;}
#petwash .type { background: url(../images/pic_26.png) no-repeat; background-size: 56px auto; width: 70px; height: 66px; margin-left: 0;}
#petwash .item p {font-size: 14px; line-height: 1.444; margin-top: -7px; margin-left: 0; text-align: left;}

#petwash_scene { background: url(../images/bg_14.jpg) no-repeat center center; background-size: cover; padding: 40px 0 43%;}
#petwash_scene h3 { margin-bottom: 10px; color: #fff;}
#petwash_scene h3:after { background-color: #fff;}
#petwash_scene h4 { font-size: 14px; margin-bottom: 20px; color: #fff;}
#petwash_scene .sence_box { width: 90%; margin: 0 auto;}
#petwash_scene .sence_box li { background: rgb(255,255,255,0.9); height: 30px; line-height: 30px; margin-bottom: 5px; font-size: 14px;}
*/
#ear_clean { background: url(../images/bg_15.jpg) no-repeat center center; background-size: cover; padding: 20px 0 25px;}
#ear_clean h4 { margin-bottom: 10px;}
#ear_clean h4 img { height: 53px; width: auto;}
#ear_clean .item { display: flex; align-items: center; justify-content: center;  margin-bottom: 48%;}
#ear_clean .type { background: url(../images/pic_26.png) no-repeat; background-size: 56px auto; width: 70px; height: 66px; margin-left: 0;}
#ear_clean .item p { font-size: 14px; line-height: 1.444; margin-top: -7px; margin-left: 0; text-align: left; }

#ear_clean_scene { background: url(../images/bg_16.jpg) no-repeat center center; background-size: cover; padding: 40px 0 40px;}
#ear_clean_scene h3 { margin-bottom: 21px;}
#ear_clean_scene h4 { font-size: 14px; margin-bottom: 20px;}
#ear_clean_scene .sence_box { width: 90%; margin: 0 auto;}
#ear_clean_scene .sence_box li { background: rgb(255,255,255,0.9); height: 30px; line-height: 30px; margin-bottom: 5px; font-size: 14px;}

#paws_care { background: url(../images/bg_17.jpg) no-repeat center center; background-size: cover; padding: 40px 0 20px;}
#paws_care h4 { margin-bottom: 10px;}
#paws_care h4 img { height: 53px; width: auto;}
#paws_care .item { display: flex; align-items: center; justify-content: center;  margin-bottom: 48%;}
#paws_care .type { background: url(../images/pic_30.png) no-repeat; background-size: 65px auto; width: 70px; height: 66px; margin-left: 0;}
#paws_care .item p { font-size: 14px; line-height: 1.444; margin-top: -7px; margin-left: 0; text-align: left; }

#paws_care_scene { background: url(../images/bg_18.jpg) no-repeat center center; background-size: cover; padding: 40px 0 80px;}
#paws_care_scene h3 { margin-bottom: 10px;}
#paws_care_scene h4 { font-size: 14px; margin-bottom: 20px;}
#paws_care_scene .sence_box { width: 90%; margin: 0 auto;}
#paws_care_scene .sence_box li { background: rgb(255,255,255,0.9); height: 30px; line-height: 30px; margin-bottom: 5px; font-size: 14px;}

#cleaning_form { background: url(../images/bg_19.jpg) no-repeat center center; background-size: cover; padding: 20px 0 20px;}
#cleaning_form h4 { margin-bottom: 10px;}
#cleaning_form h4 img { height: 53px; width: auto;}
#cleaning_form .item { display: flex; align-items: center; justify-content: center;  margin-bottom: 50%;}
#cleaning_form .type { background: url(../images/pic_22.png) no-repeat; background-size: 65px auto; width: 70px; height: 66px; margin-left: 0;}
#cleaning_form .item p { font-size: 14px; line-height: 1.444; margin-top: -7px; margin-left: 0; text-align: left; }

#cleaning_form_scene { background: url(../images/bg_20.jpg) no-repeat center center; background-size: cover; padding: 40px 0 50px;}
#cleaning_form_scene h3 { margin-bottom: 10px;}
#cleaning_form_scene h4 { font-size: 14px; margin-bottom: 20px;}
#cleaning_form_scene .sence_box { width: 90%; margin: 0 auto;}
#cleaning_form_scene .sence_box li { background: rgb(255,255,255,0.9); height: 30px; line-height: 30px; margin-bottom: 5px; font-size: 14px;}







#pet_fair_asia { background: url(../images/bg_21.jpg) no-repeat center center; background-size: cover; padding: 30px 0 ;}
#pet_fair_asia h4 { margin-bottom: 8px; margin-left: 0;}
#pet_fair_asia img { width: 85%; padding: 0 0 0 10px;}
#pet_fair_asia p { font-size: 14px; line-height: 1.556; margin: -8px 0 30px; text-align: start; letter-spacing: 0.06em;}
#pet_fair_asia p:last-child { margin-bottom: 0;}
#pet_fair_asia p sup { font-size: 17px;}
#pet_fair_asia span { font-size: 10px; text-align: start; letter-spacing: 0.05em;}



#recommend { background: url(../images/bg_22.jpg) no-repeat center center; background-size: cover; padding: 40px 0 ;}
#recommend h3 { margin-bottom: 10px; color: #fff;}
#recommend h3:after {background-color: #fff;}
#recommend h4 { font-size: 14px; margin-bottom: 20px; color: #fff;}
#recommend img { width: 40%;}
#recommend .reco { background: url(../images/pic_35.png) no-repeat; background-size: 100% 100%; width: 83%; height: auto; margin: 15px auto 0; padding: 17px 21px 17px; }
#recommend .reco p { font-size: 10px; line-height: 1.769; margin-top: -7px; text-align: left;}
#recommend .reco span { font-size: 10px; margin-left: 7px;}
#recommend .reco .docter { font-size: 18px; color: #689d2a; font-family: beloved-script, sans-serif; font-weight: 400; margin-right: 13px;}
#recommend .reco .name { font-size: 12px; font-family: yu-mincho-pr6n, sans-serif; font-weight: 400; margin: 0 0 10px; text-align: center;}


/* #gallery { background: url(../images/bg_23.jpg) no-repeat center center; background-size: cover; padding: 47px 0 43px;}

#gallery h3 { margin-bottom: 21px;}

#gallery ul { display: flex; flex-wrap: wrap; justify-content: space-between; width: 79%; margin: 0 auto;}

#gallery ul li { margin-bottom: 11px;}

#gallery ul li img { width: 100%;} */
#gallery { padding: 25px 0 20px; }
#gallery ul li { margin-bottom: 2%; }
#gallery ul li { width: 32%; }
#gallery ul li img { width: 100%; height: auto;}


#contact { background: url(../images/bg_24.jpg) no-repeat center center; background-size: cover; height: auto; padding: 30px 0 40px;}
#contact h3 { margin-bottom: 15px;}
#contact h4 { margin-bottom: 22px; font-size: 19px;}
#contact table { width: 100%; }
#contact table th { text-align: left; font-size: 14px; padding-bottom: 10px; width: 100%; }
#contact table td {  margin-bottom: 0; width: 100%; }
#contact table td input[type="text"] { padding: 8px 15px; width: 100%; border: none; font-size: 14px;}
#contact table td:last-child { margin-bottom: 0;}
#contact table td textarea { border: none; }
#contact table .Required { color: #eb6100; margin-left: 14x;}
#contact input[type="submit"] { font-size: 15px; width: 100%; height: 40px; background: url(../images/icn_01.png) no-repeat 90% center #eb6100; border-radius: 65px; margin: 0 auto; display: block; color: #fff; line-height: 40px; background-size: 2%;}


#confirm { padding: 50px 0; text-align: center; border-bottom: 1px solid #ededed;}
#confirm h4 { padding: 20px 0 0; }
#confirm h2 { padding:  30px 0 20px; }
#confirm p { text-align: left; }
#confirm p.caution { line-height: 150%; text-align: center; padding: 0 0 30px;}

#confirm table { width: 100%; }
#confirm table th { background: #ededed; display: block; text-align: left; padding: 4%;}
#confirm table td  { display: block; padding: 5%;} 
.forward_btn input[type="submit"] { font-size: 15px; width: 100%; height: 40px; background: url(../images/icn_01.png) no-repeat 90% center #eb6100; border-radius: 65px; margin: 0 auto; display: block; color: #fff; line-height: 40px; background-size: 2%; }
.back_btn { background: #c9c9c9 ;border-radius: 65px; margin-bottom: 10px; }


#error { padding: 100px 0; text-align: center; border-bottom: 1px solid #ededed; }
#error h4 {  padding: 30px 0 50px; }
#error h2 { padding:  0 0 50px; }
#error p span { display: block; padding: 20px 0 0; }
#error p.caution { line-height: 150%; }
#error p.alert { text-align: center; line-height: 150%; padding: 20px 0 50px;}


#thanks { padding: 50px 0; text-align: center; border-bottom: 1px solid #ededed;  }
#thanks h2 { padding:  0 0 50px; text-align: center; }
#thanks p.caution { line-height: 150%; padding: 0 0 20px; text-align: center;}
#thanks small { font-size: 12px; line-height: 150%; }
#thanks .top_btn { padding: 50px 0; text-align: center; }
#thanks .top_btn a { display: block; display: inline-block; background:#838383; color: #fff; line-height: 60px; width: 300px; font-size: 20px; }




/* モーダルCSS */
.modalArea {  display: none;  position: fixed;  z-index: 10; /*サイトによってここの数値は調整 */  top: 0;  left: 0;  width: 100%;  height: 100%;}
.modalBg {  width: 100%;  height: 100%;  background-color: rgba(30,30,30,0.9);}
.modalWrapper { position: absolute;  top: 50%;  left: 50%;  transform:translate(-50%,-50%);  width: 100%;  max-width: 700px; padding: 38px 5%;  background-color: #fff;}
.modalWrapper_s { background: url(../images/modal_bg.jpg) no-repeat; background-size: cover; position: absolute;  top: 50%;  left: 50%;  transform:translate(-50%,-50%);  width: 100%;  max-width: 700px; padding: 38px 5%;  background-color: #fff;}
.closeModal {  position: absolute;  top: 0.5rem;  right: 1rem;  cursor: pointer; color: #fff;}
#modalArea h3 { color: #fff; }
#modalArea h3:after { color: #fff; background: #fff;}
#modalArea p { font-size: 12px; line-height: 180%; text-align: left; padding: 30px 0 0 ;  color: #fff;}
	
#modalec .modalWrapper h2 { font-size: 20px; line-height: 150%;  color: #fff; padding: 0 0 30px;}

}

.modal img {
  width: 70% !important;
/*
  height: auto;*/ /* アスペクト比を保つために自動調整 */
}

.modal-content {
  background-color: #fff;
  padding: 30px;
  width: 100%;
  max-width: 1200px;
  position: relative; /* .close を右上に配置するために必要 */
  border-radius: 8px; /* モーダルに角丸を追加（オプション） */
}

.close {
  position: absolute; /* 親要素 .modal-content 内での絶対配置 */
  top: 0.25rem; /* 上からの距離 */
  right: 0.25rem; /* 右からの距離 */
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  z-index: 1; /* modal-contentより上に表示 */
}


.close:hover {
  color: #000; /* ホバー時の色変更（オプション） */
}


.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.85); /* 半透明の黒 */
  z-index: 998;
  display: none;
}

.modal {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  background: #fff;
  width: 100%;
  max-width: 700px;
  padding: 20px;
}

@media(max-width:600px){
 .modal{
width:95%
}

.modal img {
  width: 100% !important;

}
}

.img872 {
  width: 872px;
  height: auto;
  display: block;
  margin: 0 auto;
}