/*==========================================
Primanet Rule css
===========================================*/
*{
	font-style: normal;
}
html{
 	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 	-webkit-text-size-adjust: none;/*iphoneの横向きの文字拡大制御*/
 	font-family: 'Noto Sans JP', sans-serif;
	color: #333;
  	letter-spacing: 1px;
	font-size: 16px;/*通常 16px=1rem*/
	font-weight: 100;	
}
h1, h2, h3, h4, h5, h6, p,a,address,
dl, dt, dd, ol, ul, li, tr, th, td,
div, input, select, textarea,
.fs_10r{
	font-size: 1rem;
	line-height: 1.8rem;

}
.fs_07r{ font-size: 0.7rem; }
.fs_08r{ font-size: 0.8rem; }
.fs_09r{ font-size: 0.9rem; }
.fs_10r{ font-size: 1rem; }/*基準*/
.fs_11r{ font-size: 1.1rem; }
.fs_12r{ font-size: 1.2rem; }
.fs_13r{ font-size: 1.3rem; }
.fs_14r{ font-size: 1.4rem; }
.fs_15r{ font-size: 1.5rem; }
.fs_16r{ font-size: 1.6rem; }
.fs_17r{ font-size: 1.7rem; }
.fs_18r{ font-size: 1.8rem; }
.fs_19r{ font-size: 1.9rem; }
.fs_20r{ font-size: 2rem; }
.fs_21r{ font-size: 2.1rem; }
.fs_22r{ font-size: 2.2rem; }
.fs_23r{ font-size: 2.3rem; }
.fs_24r{ font-size: 2.4rem; }
.fs_25r{ font-size: 2.5rem; }
.fs_26r{ font-size: 2.6rem; }
.fs_27r{ font-size: 2.7rem; }
.fs_28r{ font-size: 2.8rem; }
.fs_29r{ font-size: 2.9rem; }
.fs_30r{ font-size: 3rem; }
.fs_31r{ font-size: 3.1rem; }
.fs_32r{ font-size: 3.2rem; }
.fs_33r{ font-size: 3.3rem; }
.fs_34r{ font-size: 3.4rem; }
.fs_35r{ font-size: 3.5rem; }
.fs_36r{ font-size: 3.6rem; }
.fs_37r{ font-size: 3.7rem; }
.fs_38r{ font-size: 3.8rem; }
.fs_39r{ font-size: 3.9rem; }
.fs_40r{ font-size: 4rem; }
.fs_50r{ font-size: 5rem; }

.lh_10r{ line-height: 1rem; }
.lh_11r{ line-height: 1.1rem; }
.lh_12r{ line-height: 1.2rem; }
.lh_13r{ line-height: 1.3rem; }
.lh_14r{ line-height: 1.4rem; }
.lh_15r{ line-height: 1.5rem; }
.lh_16r{ line-height: 1.6rem; }
.lh_17r{ line-height: 1.7rem; }
.lh_18r{ line-height: 1.8rem; }
.lh_19r{ line-height: 1.9rem; }
.lh_20r{ line-height: 2rem; }
.lh_22r{ line-height: 2.2rem; }
.lh_23r{ line-height: 2.3rem; }
.lh_24r{ line-height: 2.4rem; }
.lh_25r{ line-height: 2.5rem; }
.lh_26r{ line-height: 2.6rem; }
.lh_27r{ line-height: 2.7rem; }
.lh_28r{ line-height: 2.8rem; }
.lh_29r{ line-height: 2.9rem; }
.lh_30r{ line-height: 3rem; }
.lh_31r{ line-height: 3.1rem; }
.lh_32r{ line-height: 3.2rem; }
.lh_33r{ line-height: 3.3rem; }
.lh_34r{ line-height: 3.4rem; }
.lh_35r{ line-height: 3.5rem; }
.lh_36r{ line-height: 3.6rem; }
.lh_37r{ line-height: 3.7rem; }
.lh_38r{ line-height: 3.8rem; }
.lh_39r{ line-height: 3.9rem; }
.lh_40r{ line-height: 4rem; }
.lh_41r{ line-height: 4.1rem; }
.lh_42r{ line-height: 4.2rem; }
.lh_43r{ line-height: 4.3rem; }
.lh_44r{ line-height: 4.4rem; }
.lh_45r{ line-height: 4.5rem; }
.lh_46r{ line-height: 4.6rem; }
.lh_47r{ line-height: 4.7rem; }
.lh_48r{ line-height: 4.8rem; }
.lh_49r{ line-height: 4.9rem; }
.lh_50r{ line-height: 5rem; }
.lh_51r{ line-height: 5.1rem; }
.lh_52r{ line-height: 5.2rem; }
.lh_53r{ line-height: 5.3rem; }
.lh_54r{ line-height: 5.4rem; }
.lh_55r{ line-height: 5.5rem; }
.lh_56r{ line-height: 5.6rem; }
.lh_57r{ line-height: 5.7rem; }
.lh_58r{ line-height: 5.8rem; }
.lh_59r{ line-height: 5.9rem; }
.lh_60r{ line-height: 6rem; }


.fw_900,.fw_b{ font-weight: 900; }

.fw_700{ font-weight: 700; }

.robot{
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
}
.robot_b{
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
}
.robot_co{
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 400;
}
.robot_co_b{
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 700;
}

.mgt_0{ margin-top: 0; }
.mgt_10{ margin-top: 0.625rem; }/*10px*/
.mgt_20{ margin-top: 1.25rem; }/*20px*/
.mgt_30{ margin-top: 1.875rem; }/*30px*/
.mgt_40{ margin-top: 2.5rem; }/*40px*/
.mgt_50{ margin-top: 3.125rem; }/*50px*/
.mgt_60{ margin-top: 3.75rem; }/*60px*/
.mgt_70{ margin-top: 4.375rem; }/*70px*/
.mgt_80{ margin-top: 5rem; }/*80px*/
.mgt_90{ margin-top: 5.625rem; }/*90px*/
.mgt_100{ margin-top: 6.25rem; }/*100px*/

.mgb_0{ margin-bottom: 0; }
.mgb_10{ margin-bottom: 0.625rem; }/*10px*/
.mgb_20{ margin-bottom: 1.25rem; }/*20px*/
.mgb_30{ margin-bottom: 1.875rem; }/*30px*/
.mgb_40{ margin-bottom: 2.5rem; }/*40px*/
.mgb_50{ margin-bottom: 3.125rem; }/*50px*/
.mgb_60{ margin-bottom: 3.75rem; }/*60px*/
.mgb_70{ margin-bottom: 4.375rem; }/*70px*/
.mgb_80{ margin-bottom: 5rem; }/*80px*/
.mgb_90{ margin-bottom: 5.625rem; }/*90px*/
.mgb_100{ margin-bottom: 6.25rem; }/*100px*/

.pd_0{ padding: 0; }
.pd_10{ padding: 0.625rem; }/*10px*/
.pd_20{ padding: 1.25rem; }/*20px*/
.pd_30{ padding: 1.875rem; }/*30px*/
.pd_40{ padding: 2.5rem; }/*40px*/
.pd_50{ padding: 3.125rem; }/*50px*/
.pd_60{ padding: 3.75rem; }/*60px*/
.pd_70{ padding: 4.375rem; }/*70px*/
.pd_80{ padding: 5rem; }/*80px*/
.pd_90{ padding: 5.625rem; }/*90px*/
.pd_100{ padding: 6.25rem; }/*100px*/

.pdt_0{ padding-top: 0; }
.pdt_10{ padding-top: 0.625rem; }/*10px*/
.pdt_20{ padding-top: 1.25rem; }/*20px*/
.pdt_30{ padding-top: 1.875rem; }/*30px*/
.pdt_40{ padding-top: 2.5rem; }/*40px*/
.pdt_50{ padding-top: 3.125rem; }/*50px*/
.pdt_60{ padding-top: 3.75rem; }/*60px*/
.pdt_70{ padding-top: 4.375rem; }/*70px*/
.pdt_80{ padding-top: 5rem; }/*80px*/
.pdt_90{ padding-top: 5.625rem; }/*90px*/
.pdt_100{ padding-top: 6.25rem; }/*100px*/

.pdb_0{ padding-bottom: 0; }
.pdb_10{ padding-bottom: 0.625rem; }/*10px*/
.pdb_20{ padding-bottom: 1.25rem; }/*20px*/
.pdb_30{ padding-bottom: 1.875rem; }/*30px*/
.pdb_40{ padding-bottom: 2.5rem; }/*40px*/
.pdb_50{ padding-bottom: 3.125rem; }/*50px*/
.pdb_60{ padding-bottom: 3.75rem; }/*60px*/
.pdb_70{ padding-bottom: 4.375rem; }/*70px*/
.pdb_80{ padding-bottom: 5rem; }/*80px*/
.pdb_90{ padding-bottom: 5.625rem; }/*90px*/
.pdb_100{ padding-bottom: 6.25rem; }/*100px*/

.txal_l{ text-align: left; }
.txal_r{ text-align: right; }
.txal_c{ text-align: center; }

.dsp_bl{
	display: block;
}
.dsp_non{
	display: none;
}
.flex_{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.flex_2,.flex_3,.flex_4{
	display: flex;
	justify-content: space-between;
}
.flex_2 li,
.flex_2 .f_item{
	width: 47.5%;	
}
.flex_3 li,
.flex_3 .f_item{
	width: 30%;
}
.flex_4 li,
.flex_4 .f_item{
	width: 22%;
}

.br_on{
	display: block;
}
.br_off{
	display: none;
}

.w_10{ width: 10%; }
.w_15{ width: 15%; }
.w_20{ width: 20%; }
.w_25{ width: 25%; }
.w_30{ width: 30%; }
.w_35{ width: 35%; }
.w_40{ width: 40%; }
.w_45{ width: 45%; }
.w_50{ width: 50%; }
.w_55{ width: 55%; }
.w_60{ width: 60%; }
.w_65{ width: 65%; }
.w_70{ width: 70%; }
.w_75{ width: 75%; }
.w_80{ width: 80%; }
.w_85{ width: 85%; }
.w_90{ width: 90%; }

img{
	width: 100%;
	height: auto;
	vertical-align: bottom;
}
a{
  text-decoration: none;
}
a:hover{
  opacity: 0.7;
}
.pink{
	color: #ff7bac;/*ピンク*/
}

ul li,
.f_item{
	/*background-color: #ccc;*/
	/*border: 1px solid #000;*/
}
h1{
	/*padding-bottom: 10px;*/
}

.palt {
  font-feature-settings: "palt";
}

:root {
  --pink: #ed1e79;/*ピンク*/
  --black: #333;/*ブラックテキスト*/
} 

.pink{
	color: #ed1e79;
}
.indent{
	text-indent: -1em;
  padding-left: 1em;
}
/*=================================================================================================*/
/* tablet向けレイアウト：768px以上 */
@media only screen and (min-width: 768px) {
html{
  	letter-spacing: 1px;
	font-size: 16px;

}
h1, h2, h3, h4, h5, h6, p, a, address,
dl, dt, dd, ol, ul, li, tr, th, td,
div, input, select, textarea,.fs_10r{
	font-size: 16px;

}
.fs__10p{ font-size: 10px; }
.fs__11p{ font-size: 11px; }
.fs__12p{ font-size: 12px; }
.fs__13p{ font-size: 13px; }
.fs__14p{ font-size: 14px; }
.fs__15p{ font-size: 13px; }
.fs__16p{ font-size: 16px; }
.fs__17p{ font-size: 17px; }
.fs__18p{ font-size: 18px; }
.fs__19p{ font-size: 19px; }
.fs__20p{ font-size: 20px; }
.fs__21p{ font-size: 21px; }
.fs__22p{ font-size: 22px; }
.fs__23p{ font-size: 23px; }
.fs__24p{ font-size: 24px; }
.fs__25p{ font-size: 25px; }
.fs__26p{ font-size: 26px; }
.fs__27p{ font-size: 27px; }
.fs__28p{ font-size: 28px; }
.fs__29p{ font-size: 29px; }
.fs__30p{ font-size: 30px; }
.fs__31p{ font-size: 31px; }
.fs__32p{ font-size: 32px; }
.fs__33p{ font-size: 33px; }
.fs__34p{ font-size: 34px; }
.fs__35p{ font-size: 35px; }
.fs__36p{ font-size: 36px; }
.fs__37p{ font-size: 37px; }
.fs__38p{ font-size: 38px; }
.fs__39p{ font-size: 39px; }
.fs__40p{ font-size: 40px; }
.fs__41p{ font-size: 41px; }
.fs__42p{ font-size: 42px; }
.fs__43p{ font-size: 43px; }
.fs__44p{ font-size: 44px; }
.fs__45p{ font-size: 45px; }
.fs__46p{ font-size: 46px; }
.fs__47p{ font-size: 47px; }
.fs__48p{ font-size: 48px; }
.fs__49p{ font-size: 49px; }
.fs__50p{ font-size: 50px; }
.fs__51p{ font-size: 51px; }
.fs__52p{ font-size: 52px; }
.fs__53p{ font-size: 53px; }
.fs__54p{ font-size: 54px; }
.fs__55p{ font-size: 55px; }
.fs__56p{ font-size: 56px; }
.fs__57p{ font-size: 57px; }
.fs__58p{ font-size: 58px; }
.fs__59p{ font-size: 59px; }
.fs__60p{ font-size: 60px; }

.lh__30p{ line-height: 30px; }
.lh__32p{ line-height: 32px; }
.lh__34p{ line-height: 34px; }
.lh__36p{ line-height: 36px; }
.lh__36p{ line-height: 38px; }
.lh__40p{ line-height: 40px; }
.lh__50p{ line-height: 50px; }
.lh__60p{ line-height: 60px; }
.lh__70p{ line-height: 70px; }
.lh__80p{ line-height: 80px; }
.lh__90p{ line-height: 90px; }
.lh__100p{ line-height: 100px; }

.fw__b{ font-weight: 700; }

.mgt__0{ margin-top: 0px; }
.mgt__10{ margin-top: 10px; }
.mgt__20{ margin-top: 20px; }
.mgt__30{ margin-top: 30px; }
.mgt__40{ margin-top: 40px; }
.mgt__50{ margin-top: 50px; }
.mgt__60{ margin-top: 60px; }
.mgt__70{ margin-top: 70px; }
.mgt__80{ margin-top: 80px; }
.mgt__90{ margin-top: 90px; }
.mgt__100{ margin-top: 100px; }

.mgb__0{ margin-bottom: 0px; }
.mgb__10{ margin-bottom: 10px; }
.mgb__20{ margin-bottom: 20px; }
.mgb__30{ margin-bottom: 30px; }
.mgb__40{ margin-bottom: 40px; }
.mgb__50{ margin-bottom: 50px; }
.mgb__60{ margin-bottom: 60px; }
.mgb__70{ margin-bottom: 70px; }
.mgb__80{ margin-bottom: 80px; }
.mgb__90{ margin-bottom: 90px; }
.mgb__100{ margin-bottom: 100px; }

.pd__0{ padding: 0px; }
.pd__10{ padding: 10px; }
.pd__20{ padding: 20px; }
.pd__30{ padding: 30px; }
.pd__40{ padding: 40px; }
.pd__50{ padding: 50px; }
.pd__60{ padding: 60px; }
.pd__70{ padding: 70px; }
.pd__80{ padding: 80px; }
.pd__90{ padding: 90px; }
.pd__100{ padding: 100px; }

.pdt__0{ padding-top: 0px; }
.pdt__10{ padding-top: 10px; }
.pdt__20{ padding-top: 20px; }
.pdt__30{ padding-top: 30px; }
.pdt__40{ padding-top: 40px; }
.pdt__50{ padding-top: 50px; }
.pdt__60{ padding-top: 60px; }
.pdt__70{ padding-top: 70px; }
.pdt__80{ padding-top: 80px; }
.pdt__90{ padding-top: 90px; }
.pdt__100{ padding-top: 100px; }

.pdb__0{ padding-bottom: 0px; }
.pdb__10{ padding-bottom: 10px; }
.pdb__20{ padding-bottom: 20px; }
.pdb__30{ padding-bottom: 30px; }
.pdb__40{ padding-bottom: 40px; }
.pdb__50{ padding-bottom: 50px; }
.pdb__60{ padding-bottom: 60px; }
.pdb__70{ padding-bottom: 70px; }
.pdb__80{ padding-bottom: 80px; }
.pdb__90{ padding-bottom: 90px; }
.pdb__100{ padding-bottom: 100px; }

.txal__l{ text-align: left; }
.txal__r{ text-align: right; }
.txal__c{ text-align: center; }

.flex__{
	display: flex;
	justify-content: space-between;
}
.flex__2,.flex__3,.flex__4{
	display: flex;
	justify-content: space-between;
}
.flex__2 li,
.flex__2 .f_item{
	width: 47.5%;
}
.flex__3 li,
.flex__3 .f_item{
	width: 30%;
}
.flex__4 li,
.flex__4 .f_item{
	width: 22.5%;
}

.dsp__bl{
	display: inline-block;
}
.dsp__non{
	display: none;
}

.br__on{
	display: block;
}
.br__off{
	display: none;
}

.w__10{ width: 10%; }
.w__15{ width: 15%; }
.w__20{ width: 20%; }
.w__25{ width: 25%; }
.w__30{ width: 30%; }
.w__35{ width: 35%; }
.w__40{ width: 40%; }
.w__45{ width: 45%; }
.w__475{ width: 47.5%; }
.w__50{ width: 50%; }
.w__55{ width: 55%; }
.w__60{ width: 60%; }
.w__65{ width: 65%; }
.w__70{ width: 70%; }
.w__75{ width: 75%; }
.w__80{ width: 80%; }
.w__85{ width: 85%; }
.w__90{ width: 90%; }
.inner_wrap{
	width: 95%;
	margin: 0 auto;
}
}/*768*/
/*=================================================================================================*/
/* PC向けレイアウトの指定:テーマにより*/
@media only screen and (min-width: 1200px) {
/*==============================================================*/
.fs___10p{ font-size: 10px; }
.fs___11p{ font-size: 11px; }
.fs___12p{ font-size: 12px; }
.fs___13p{ font-size: 13px; }
.fs___14p{ font-size: 14px; }
.fs___15p{ font-size: 13px; }
.fs___16p{ font-size: 16px; }
.fs___17p{ font-size: 17px; }
.fs___18p{ font-size: 18px; }
.fs___19p{ font-size: 19px; }
.fs___20p{ font-size: 20px; }
.fs___21p{ font-size: 21px; }
.fs___22p{ font-size: 22px; }
.fs___23p{ font-size: 23px; }
.fs___24p{ font-size: 24px; }
.fs___25p{ font-size: 25px; }
.fs___26p{ font-size: 26px; }
.fs___27p{ font-size: 27px; }
.fs___28p{ font-size: 28px; }
.fs___29p{ font-size: 29px; }
.fs___30p{ font-size: 30px; }
.fs___31p{ font-size: 31px; }
.fs___32p{ font-size: 32px; }
.fs___33p{ font-size: 33px; }
.fs___34p{ font-size: 34px; }
.fs___35p{ font-size: 35px; }
.fs___36p{ font-size: 36px; }
.fs___37p{ font-size: 37px; }
.fs___38p{ font-size: 38px; }
.fs___39p{ font-size: 39px; }
.fs___40p{ font-size: 40px; }
.fs___41p{ font-size: 41px; }
.fs___42p{ font-size: 42px; }
.fs___43p{ font-size: 43px; }
.fs___44p{ font-size: 44px; }
.fs___45p{ font-size: 45px; }
.fs___46p{ font-size: 46px; }
.fs___47p{ font-size: 47px; }
.fs___48p{ font-size: 48px; }
.fs___49p{ font-size: 49px; }
.fs___50p{ font-size: 50px; }
.fs___51p{ font-size: 51px; }
.fs___52p{ font-size: 52px; }
.fs___53p{ font-size: 53px; }
.fs___54p{ font-size: 54px; }
.fs___55p{ font-size: 55px; }
.fs___56p{ font-size: 56px; }
.fs___57p{ font-size: 57px; }
.fs___58p{ font-size: 58px; }
.fs___59p{ font-size: 59px; }
.fs___60p{ font-size: 60px; }
.fs___70p{ font-size: 70px; }
.fs___80p{ font-size: 80px; }
.fs___90p{ font-size: 90px; }
.fs___100p{ font-size: 100px; }

.lh___30p{ line-height: 30px; }
.lh___32p{ line-height: 32px; }
.lh___34p{ line-height: 34px; }
.lh___36p{ line-height: 36px; }
.lh___36p{ line-height: 38px; }
.lh___40p{ line-height: 40px; }
.lh___50p{ line-height: 50px; }
.lh___60p{ line-height: 60px; }
.lh___70p{ line-height: 70px; }
.lh___80p{ line-height: 80px; }
.lh___90p{ line-height: 90px; }
.lh___100p{ line-height: 100px; }

.mgt___0{ margin-top: 0px; }
.mgt___10{ margin-top: 10px; }
.mgt___20{ margin-top: 20px; }
.mgt___30{ margin-top: 30px; }
.mgt___40{ margin-top: 40px; }
.mgt___50{ margin-top: 50px; }
.mgt___60{ margin-top: 60px; }
.mgt___70{ margin-top: 70px; }
.mgt___80{ margin-top: 80px; }
.mgt___90{ margin-top: 90px; }
.mgt___100{ margin-top: 100px; }

.mgb___0{ margin-bottom: 0px; }
.mgb___10{ margin-bottom: 10px; }
.mgb___20{ margin-bottom: 20px; }
.mgb___30{ margin-bottom: 30px; }
.mgb___40{ margin-bottom: 40px; }
.mgb___50{ margin-bottom: 50px; }
.mgb___60{ margin-bottom: 60px; }
.mgb___70{ margin-bottom: 70px; }
.mgb___80{ margin-bottom: 80px; }
.mgb___90{ margin-bottom: 90px; }
.mgb___100{ margin-bottom: 100px; }

.pd___0{ padding: 0px; }
.pd___10{ padding: 10px; }
.pd___20{ padding: 20px; }
.pd___30{ padding: 30px; }
.pd___40{ padding: 40px; }
.pd___50{ padding: 50px; }
.pd___60{ padding: 60px; }
.pd___70{ padding: 70px; }
.pd___80{ padding: 80px; }
.pd___90{ padding: 90px; }
.pd___100{ padding: 100px; }

.pdt___0{ padding-top: 0px; }
.pdt___10{ padding-top: 10px; }
.pdt___20{ padding-top: 20px; }
.pdt___30{ padding-top: 30px; }
.pdt___40{ padding-top: 40px; }
.pdt___50{ padding-top: 50px; }
.pdt___60{ padding-top: 60px; }
.pdt___70{ padding-top: 70px; }
.pdt___80{ padding-top: 80px; }
.pdt___90{ padding-top: 90px; }
.pdt___100{ padding-top: 100px; }

.pdb___0{ padding-bottom: 0px; }
.pdb___10{ padding-bottom: 10px; }
.pdb___20{ padding-bottom: 20px; }
.pdb___30{ padding-bottom: 30px; }
.pdb___40{ padding-bottom: 40px; }
.pdb___50{ padding-bottom: 50px; }
.pdb___60{ padding-bottom: 60px; }
.pdb___70{ padding-bottom: 70px; }
.pdb___80{ padding-bottom: 80px; }
.pdb___90{ padding-bottom: 90px; }
.pdb___100{ padding-bottom: 100px; }

.txal___l{ text-align: left; }
.txal___r{ text-align: right; }
.txal___c{ text-align: center; }

.flex___2,.flex___3{
	display: flex;
	justify-content: space-between;
}
.flex___2 li,
.flex___2 .f_item{
	width: 47.5%;
}
.flex___3 li,
.flex___3 .f_item{
	width: 30%;
}

.br___on{
	display: block;
}
.br___off{
	display: none;
}
}/*1200*/
/*==========================================
Primanet Rule css
===========================================*/
/***************************************************************************************************/
/***************************************************************************************************/
/***************************************************************************************************/
/**********                    *********************************************************************/
/**********   **************   ********************************************************************/
/**********   **************   *********************************************************************/
/**********   **************   *********************************************************************/
/**********   **************   *********************************************************************/
/**********   **************   *********************************************************************/
/**********   **************   *********************************************************************/
/**********   **************   *********************************************************************/
/**********   **************   *********************************************************************/
/**********   **************   *********************************************************************/
/**********                    **********************************************************************/
/***************************************************************************************************/
/***************************************************************************************************/
/******
/*=================================================================================================
desgin css
==================================================================================================*/
@media only screen and (min-width: 0px) {
/**********************************************************************************************/
/*
img{
	width: 100% !important;
	display: none;
}
*/

.page_top::before{
	content:"";
	display:block;
	position:fixed;
	top:0;
	left:0;
	z-index:-2;
	background: url("../images/common/bg.jpg") center center no-repeat; 
	background-size: cover;
	-webkit-background-size: cover;
	width: 100%;
	height: 100%;
}
.page_top::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  background: rgba(255,255,255,0.6);
}
/***************** header 0 *******************/
/***************** hamburger 0 **************/

.hamburger{
  position: absolute;
  z-index: 10001;
  right: 15px;
  top: 31px;
}
.hamburger_btn {
  position: relative;
  width: 25px;
  height: 21px;
  cursor: pointer;
}
.hamburger_btn span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: var(--black);
}
.hamburger_btn, .hamburger_btn span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.hamburger_btn span:nth-of-type(1) {
  top: 0;
}
.hamburger_btn span:nth-of-type(2) {
  top: 9px;
}
.hamburger_btn span:nth-of-type(3) {
  bottom: 0;
}
#btn01.active span:nth-of-type(1) {
  -webkit-transform: translateY(9px) rotate(-45deg);
  transform: translateY(9px) rotate(-45deg);
   background-color: var(--black);
}
#btn01.active span:nth-of-type(2) {
  opacity: 0;
}
#btn01.active span:nth-of-type(3) {
  -webkit-transform: translateY(-9px) rotate(45deg);
  transform: translateY(-9px) rotate(45deg);
   background-color: var(--black);
}
/***************** メニュー開閉 0 **************/

#nav_content{
    overflow: auto;
    position: fixed;
    top: 45px;
    height: calc(100% - 45px);
    left: 0;
    z-index: 5000;
    width: 100%;
    max-width: 100%;
    background: #fff;
    transition: .3s ease-in-out;
    left: -100%;
}
#nav_content.active{
   left: 0;
}
#nav_content .nav_list{
  padding: 20px;
  /*border-radius: 20px;*/
  padding-top: 20px;
}
#nav_content ul li{
  text-align: center;
}
#nav_content ul li:first-child{
  padding-top: 30px;
}
#nav_content ul li:last-child{
	margin-bottom: 0;
}
#nav_content ul li a{
	line-height: 1;
	color: #000;
	display: block;
	padding: 30px 0;
	border-bottom: 1px solid #000;
}
#nav_content ul li a:hover{
	color: var(--orange);
}

/*********************　header 0 *********************/
img{
	/*display: none !important;*/
}
.site_header{
	background-color: #fff;
	position: relative;
	height: 40px;
}
.site_header h1{
	position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.site_header .header_brand{
	width: 120px;
  position: absolute;
	top: 0;
	left: 0;
	z-index: 10000;
}
.site_header .header_logo:hover{
	opacity: 1;
}
.site_header .pink_line{
	top: 25px;
	width: 100%;
	position: absolute;
	z-index: 9999;
}
.site_header .pink_line img{
	height: 40px;
}
/*********************　common 0 *********************/
.header_inner,
.inner_wrap{
	width: 90%;
	max-width: 400px;
	margin: 0 auto;
}
.top section{
	background-color: #fff;
	padding: 50px 0;
}
.top section.hero{
	padding: 0;
	padding-bottom: 50px;
}
#nail,
#eyelash,
#company{
	background-color: #fff;	
}
.top section.salon{
	background: none;
}
.top h2,
#nail h2,
#eyelash h2{
	text-align: center;
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 400;
  font-size:  2rem;
  letter-spacing: 5px;
}
.top h2:before,
#nail h2:before,
#eyelash h2:before{
	content: "";
	display: inline-block;
	background: url(../images/common/deco_l.svg) no-repeat;
	background-size: 50px auto;
	width: 50px;
	height: 50px;
	vertical-align: middle;
	margin-right: 10px;
}
.top h2:after,
#nail h2:after,
#eyelash h2:after{
	content: "";
	display: inline-block;
	background: url(../images/common/deco_r.svg) no-repeat;
	background-size: 50px auto;
	width: 50px;
	height: 50px;
	vertical-align: middle;
	margin-left: 10px;
}
.top .section_subtitle{
	color: var(--pink);
	text-align: center;
	font-weight: 700;
	margin-bottom: 30px;
}
.advice_message{
	background-color: #fadee6;
	border-radius: 50px;
	padding: 30px;
	color: var(--pink);
	margin: 30px 0 0;
}
.service-page .advice_message p{
	font-size: 16px;
	line-height: 1.7;
}
.service-page .faq_area{
	margin-top: 50px;
	padding-bottom: 50px;
}
#nail .faq_area h2,
#eyelash .faq_area h2{
	color: var(--pink);
	font-size: 1.2rem;
	font-weight: 600;
	text-align: left;
	margin: 15px 0;
	letter-spacing: auto;
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing: normal;
	line-height: 1.5;
}
#nail .faq_area h2:before,
#nail .faq_area h2:after,
#eyelash .faq_area h2:before,
#eyelash .faq_area h2:after{
	display: none;
}
.service-page .faq_area dl{
	background-color: #f2f2f2;
	padding: 10px;
	margin: 0 0 20px;
}
.service-page .faq_area dt{
	/*font-weight: 500;	*/
}
.service-page .faq_area dt:before{
	content: "";
	display: inline-block;
	background: url(../images/common/icon_q.svg) no-repeat;
	background-size: 16px auto;
	width: 16px;
	height: 16px;
	margin-right: 5px;

}
.service-page .faq_area dd:before{
	content: "";
	display: inline-block;
	background: url(../images/common/icon_a.svg) no-repeat;
	background-size: 16px auto;
	width: 16px;
	height: 16px;
	margin-right: 5px;
}
.service-page .faq_area dd{
	padding-left: 1.5rem;
	text-indent: -1.5rem;
}
/********************* hero 0 *********************/
.top .hero{
	background-color: #fff;	
	padding: 0;
}
.top .hero_media_wrap{
	background: url(../images/common/white_glad.png) 50% 100% no-repeat,url(../images/common/back_rose.jpg) 50% 50% repeat;
	background-size: 100% auto,1000px auto;	
}
.top .hero_media{
	max-width: 500px;
	margin: 0 auto;
}
.top .hero_title_image{
	width: 90%;
	max-width: 500px;
	margin: 0 auto;
	margin-top: -50px;
}
.top .hero_badge{
	background-color: var(--pink);
	color: #fff;
	display: inline-block;
	padding: 5px 50px 5px 10px;
	position: relative;
	margin-bottom: 10px;
	line-height: 1;
}
.top .hero_badge:after{
	position:absolute;
	right: 0;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	content: "";
	border-top: 15px solid transparent;
  border-right: 15px solid #fff;
  border-bottom: 15px solid transparent;
}
.top .hero_catch{
	margin-bottom: 10px;
}
.top .hero_lead{
	margin-bottom: 20px;
}
.top .hero_video .movie{
	display: block;
	width: 90%;
	margin: 0 auto;
	max-width: 400px;
}

/*********************　message 0 *********************/

.top section.message{
	padding: 0;
}
.top .message .bg{
	background: url(../images/common/back_rose.jpg) 50% 50% repeat;
	background-size: 1000px auto;
	position: relative;
	padding: 50px 0;
}
.top .message .bg:before{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.8);
}
.top .message .inner_wrap {
  position: relative;
  z-index: 1;
}
.top .message_body p{
	margin-bottom: 20px;
}

/********************* service 0 *********************/
.top .service_photo_nail{
	overflow: hidden;
}
.top .service_photo_nail img{
	width: 120%;
	max-width: 500px;
  position: relative;
  left: -100px;
}
.top .service_photo_eyelash{
	text-align: right;
	overflow: hidden;
}
.top .service_photo_eyelash img{
	width: 120%;
	max-width: 500px;
	margin-right: -100px;
}
.top .service_name_ja{
	background-color: var(--pink);
	color: #fff;
	display: inline-block;
	width: 260px;
	padding-left: 10px;
	position: relative;
	margin: 10px 0 20px;
}
.top .service_name_ja:after{
	position:absolute;
	right: 0;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	content: "";
	border-top: 15px solid transparent;
  border-right: 15px solid #fff;
  border-bottom: 15px solid transparent;
}
.top .service_name{
	margin-top: 30px;
}
.top .service .nail_txt_img{
	width: 250px;
}
.top .service .eyelash_txt_img{
	width: 300px;
}
.top .service_item_eyelash .service_text{
	text-align: left;
}
.top .service_link {
  margin: 20px 0;
  text-align: right;
}
.top .link_more {
  position: relative;
  display: inline-block;
  color: var(--pink);
  text-decoration: none;
  padding-bottom: 10px;
}
.top .link_more .link_en {
  font-size: 1rem;
  font-weight: 700;
  display: block;
  line-height: 1.2;
  display: block;
  padding-right: 20px;
  border-bottom: 1px solid var(--pink);
  position: relative;
}
.top .link_more .link_en::after {
  content: "";
  position: absolute;
  right: -3px;
  bottom: 8px; /* ボーダー位置に合わせる */
  width: 12px;
  height: 1px;
  background: var(--pink);
  transform: rotate(45deg);
  transform-origin: left center;
}
.top .link_more .link_ja {
	line-height: 1;
  font-size: 0.7rem;
  display: block;
  margin-top: 4px;
}
/********************* salon 0 *********************/
.top .salon_card{
	background: rgba(255, 255, 255, 0.7);
}
.top .salon_logo{
	position: relative;
}
.top .salon_logo .logo{
	width: 100px;	
	position: absolute;
	z-index: 10000;
	top: 10px;
}
.top .salon_logo .pink_line{
	position: absolute;
	z-index: 9999;
	top: 30px;
	width: 100%;	
	height: 30px;
}
.top .salon_card .inner_wrap{
	padding-top: 80px;
}
/************************footer共通***********************/
.salon_name{/*footer共通*/
	font-weight: 700;
	text-align: center;
}
.salon_name_main{/*footer共通*/
	font-size: 2rem;
	font-weight: 700;
}
.salon_info{/*footer共通*/
	margin: 20px 0;
}
.salon_info .tel a{/*footer共通*/
	color: var(--pink);
	font-size: 1.5rem;
}
.salon_info li:before{/*footer共通*/
	content: "";
	display: inline-block;
	background: url(../images/common/icon_tel.svg) no-repeat;
	background-size: 17px 17px;
	width: 17px;
	height: 17px;
	margin-right: 5px;
}
.salon_info li.time:before{/*footer共通*/
	background: url(../images/common/icon_time.svg) no-repeat;
}
.salon_info li.address:before{/*footer共通*/
	background: url(../images/common/icon_address.svg) no-repeat;
}
/************************footer共通***********************/
.top .salon_info li{
	padding-left: 20px;
	text-indent: -20px;
}
.top .salon_photo{
	margin-bottom: 20px;
}
.top .salon_desc{
	padding-bottom: 15px;
}
/********************* section_map 0 *********************/
.top .section_map .map_box{
	width: 100%;
	height: auto;
	padding-top: 62.5%;
	position: relative;
	margin: 0 auto;
	padding-bottom: 50px;
}
.top .section_map .map_box .ggmap{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
.top .access_block h3{
	color: var(--pink);
	text-align: center;
	margin: 20px 0 10px;
}
.top .access_badge{
	text-align: center;
	color: var(--pink);
	border: 1px solid var(--pink);
	border-radius: 50px;
	margin-bottom: 10px;
}
.top .access_text{
	text-align: center;
}
.top .access_text p{
	margin-bottom: 0px;

}
.top .access_text p:after{
	content: "";
	display: block;
	background: url(../images/common/arrow_bottom.svg) no-repeat;
	background-size: 30px auto;
	width: 30px;
	height: 20px;
	margin: 0 auto;
	margin-top: 10px;
	margin-bottom: 10px;
}
.top .access_text p:last-child:after{
	content: none;
}
/********************* lower_hero 0 *********************/
.service-page section.lower_hero{
	padding-top: 0;
}
.lower_hero_wrap{
  position: relative;
  text-align: center;
  overflow: hidden;
}
.lower_hero_wrap::before{
  content: "";
  position: absolute;
  inset: 0;
  background: url(../images/common/back_rose.jpg) 50% 50% repeat;
  background-size: 1000px auto;
  opacity: 0.5;
  z-index: 0;
}
.lower_hero_wrap::after{
  content: "";
  position: absolute;
  inset: 0;
  background: url(../images/common/white_glad.png) 50% 100% no-repeat;
  background-size: 100% auto;
  z-index: 1;
}
.lower_hero_wrap > *{
  position: relative;
  z-index: 2;
}
.lower_hero .page_title{
	padding: 50px 0 30px;
}
.lower_hero .page_title_en img{
	width: 200px;
}
#eyelash .lower_hero .page_title_en img{
	width: 280px;
}
.lower_hero .page_title_ja{
	display: block;
	font-weight: 700;
}
.lower_image {
	width: 80%;
	margin: 0 auto;
}
.lower_hero_content{
	padding-bottom: 30px;
}
#nail .lower_hero_lead h2,
#nail .lower_hero_menu h2,
#eyelash .lower_hero_lead h2,
#eyelash .lower_hero_menu h2{
	color: var(--pink);
	font-size: 1.2rem;
	font-weight: 600;
	text-align: left;
	margin: 15px 0;
	letter-spacing: auto;
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing: normal;
	line-height: 1.5;
}
#nail .lower_hero_lead h2:before,
#nail .lower_hero_lead h2:after,
#nail .lower_hero_menu h2:before,
#nail .lower_hero_menu h2:after,
#eyelash .lower_hero_lead h2:before,
#eyelash .lower_hero_lead h2:after,
#eyelash .lower_hero_menu h2:before,
#eyelash .lower_hero_menu h2:after{
	display: none;
}
.lower_hero_lead p{
	font-size: 16px !important;
	line-height: 1.5 !important;
	margin-bottom: 10px;
}
.lower_hero_menu{
	background-color: var(--babypink);
	padding: 30px 0 50px;
}
.lower_hero_menu ul li{
	background-color: #fff;
	border-radius: 20px;
	padding: 20px;
	margin-bottom: 20px;
	text-align: center;
}
.lower_hero_menu ul li h3{
	color: var(--pink);
	border-bottom: 1px solid var(--pink);
	font-weight: 700;
	text-align: center;
	margin-bottom: 10px;
	position: relative;
	padding: 0 30px;
	text-align: center;
	position: relative;
	letter-spacing: normal;
}
.lower_hero_menu ul li h3:before{ /*アンダーライン先の点*/
	content: '';
	position: absolute;
	bottom: -2.5px;
	left: 0;
	width: 5px;
	height: 5px;
	border-radius: 2rem;
	background: var(--pink);
}
.lower_hero_menu ul li h3:after{ /*アンダーライン先の点*/
	content: '';
	position: absolute;
	bottom: -2.5px;
	right: 0;
	width: 5px;
	height: 5px;
	border-radius: 2rem;
	background: var(--pink);
}
.lower_hero_menu ul li p{	
	text-align: left;
}
/********************* company 0 *********************/
#company .inner_wrap{
	background-color: #fff;
	padding: 20px 0;
}
#company h2{
	font-size: 1.2rem;
	font-weight: 700;
	letter-spacing: normal;
	text-align: center;
}
#company table{
	width: 90%;
	margin: 0 auto;
}
#company table tr{
	border-bottom: 1px solid var(--pink);
}
#company table .td_1{
	padding: 8px 0 8px 8px;
}
#company table .td_2{
	padding: 8px;
}
#company table .td_1{
	color: var(--pink);
	width: 25%;
}
#company table .td_2{
	width: 70%;
	line-height: 1.5rem;
}
#company table .td_2 ul li{
	padding: 0;
	margin-bottom: 10px;
	text-align: left;
	padding-left: 1rem;
	text-indent: -1rem;
	line-height: 1.5;
}
#company .access{
	padding: 0;
	padding-bottom: 50px;
}
#company .access .inner_wrap{
	padding: 0;
}
#company .access .map_box{
	width: 100%;
	height: auto;
	padding-top: 62.5%;
	position: relative;
	margin: 0 auto;
	padding-bottom: 50px;
}
#company .access .map_box .ggmap{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

/********************* footer 0 *********************/

.reserve_box{
	border: 1px solid var(--pink);
	padding: 20px;
	text-align: center;
	margin-bottom: 70px;
}
.reserve_button a{
	display: inline-block;
	background-color: var(--pink);
	color: #fff;
	border-radius: 50px;
	padding: 5px 50px;
	font-size: 1.5rem;
	margin: 10px 0;
}

.site_footer{	
	background-color: #fff;
}

.site_footer .footer_bg{
	background: url(../images/common/footer_bg.svg) no-repeat;
	background-size: cover;	
}
.footer_belt_inner_wrap{
	position:relative;
	width: 100%;
	max-width: 1100px;
	margin: 0 auto;
}
.site_footer_inner_wrap{
	width: 270px;
	margin: 0 auto;
	padding: 30px 0;
}
.site_footer .logo{
	width: 120px;
	position: absolute;
	top: -30px;
	left: 0;
	z-index: 10000;
}
.site_footer .salon_logo{
	position:relative;	
}
.site_footer .pink_line{
	top: 0;
	width: 100%;
	position: absolute;
	z-index: 9999;
	height: 30px;
}
.footer_page_top a{
	position: absolute;
	z-index: 10000;
	right: 10px;
	top: -3px;
	color: #333;
	font-weight: 700;
	font-size: 0.8rem;
}
.footer_page_top a:before{
	content: "";
	display: inline-block;
	background: url(../images/common/page_top.svg) no-repeat;
	background-size: 12px auto;
	width: 12px;
	height: 12px;
	margin-right: 3px;
	vertical-align: -2px;
}
.site_footer .footer_nav{ 
	padding-top: 50px;
}
.site_footer .footer_nav li{
	padding: 5px 0;
}
.site_footer .footer_nav a{
	color: #333;
}
.site_footer .salon_name{
	margin: 20px 0;
}
.footer_bottom{
	background: url(../images/common/footer_bottom_bg.svg) 50% 50% no-repeat;
	background-size: cover;
	text-align: center;
}

}/*0 end*/
@media only screen and (min-width: 500px) {
/************************************************************************************************************************/
/************************************************************************************************************************/
/************************************************************************************************************************/
/***********************************************************************************************************************/
/******************* fv 570 ****************************/
.top .service_photo_nail img{
	width: 120%;
	max-width: 500px;
  position: relative;
  left: 0;
}
.top .service_photo_eyelash{
	text-align: right;
	overflow: hidden;
}
.top .service_photo_eyelash img{
	width: 120%;
	max-width: 500px;
	margin-right: 0;
}

}/*570 end*/
/***************************************************************************************************/
/***************************************************************************************************/
/***************************************************************************************************/
/**********                    ******                    ******                    *****************/
/***************************   ******   ***********************   **************   *****************/
/*************************   ********   ***********************   **************   *****************/
/************************   *********   ***********************   **************   *****************/
/***********************   **********   ***********************   **************   *****************/
/**********************   ***********                    ******                    *****************/
/*********************   ************   **************   ******   **************   *****************/
/********************   *************   **************   ******   **************   *****************/
/*******************   **************   **************   ******   **************   *****************/
/******************   ***************   **************   ******   **************   *****************/
/*****************   ****************                    ******                    *****************/
/***************************************************************************************************/
/***************************************************************************************************/
@media only screen and (min-width: 768px) {
/*********************　common 768 *********************/
.header_inner,
.inner_wrap{
	width: 90%;
	max-width: 600px;
	margin: 0 auto;
}	
/*
#nail .faq_area dl{
	width: 90%;
	margin: 0 auto;
	background-color: #f2f2f2;
	padding: 10px;
	margin-bottom: 20px;

}
*/
/********************* hero 768 *********************/
.top .hero_media{
	max-width: 100%;
	margin: 0 auto;
}
.top .hero_title_image{
	width: 90%;
	max-width: 600px;
	margin: 0 auto;
	margin-top: -50px;
}
.top .hero_video .movie{
	display: block;
	width: 90%;
	margin: 0 auto;
	max-width: 600px;
}
/********************* service 768 *********************/
.top .service_item_inner{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.top .service_item_inner.service_item_eyelash{
	flex-direction: row-reverse;
}
.top .service_photo{
	width: 55%;
}
.top .service_text_wrap{
	width: 40%;
	margin: 0;
} 
.top .service_photo_nail img{
	width: 120%;
	max-width: 600px;
  position: relative;
  left: -100px;
}
.top .service_photo_eyelash{
	text-align: right;
	overflow: hidden;
}
.top .service_photo_eyelash img{
	width: 120%;
	max-width: 600px;
	margin-right: -100px;
}
.top .service_text{
	width: 90%;
}
.top .service_item.service_item_eyelash .service_text{
	padding-left: 10%;
}
/********************* salon 768 *********************/
.top .salon_card .inner_wrap{
	width: 70%;
	padding-bottom: 50px;
}
/********************* section_map 768 *********************/
.top .section_map .map_lead{
	text-align: center;
}
.top .section_map .map_box{
	width: 100%;
	height: auto;
	padding-top: 400px;
	position: relative;
	margin: 0 auto;
	padding-bottom: 0px;
}
.top .section_map .map_box .ggmap{
	position: absolute;
	width: 100%;
	height: 400px;
	top: 0;
	left: 0;
}

/********************* access 768 *********************/
.access_block,
.advice_message{
	width: 500px;
	margin: 0 auto;
	margin-bottom: 50px;
}
.service-page .access_block,
.service-page .advice_message{
	width: 80%;
	max-width: 800px;
	margin: 0 auto;
	margin-bottom: 50px;
}
.service-page .faq_area{
	width: 80%;
	max-width: 850px;
	margin: 0 auto;
}
.service-page .faq_area h2{
	margin: 0 auto;
}
.service-page .faq_area dl{
	padding: 30px;
}
.advice_message{
	margin-bottom: 0;
}
/********************* lower_hero 768 *********************/
#nail .lower_hero_content .inner_wrap,
#eyelash .lower_hero_content .inner_wrap{
	width: 90%;
	max-width: 970px;
	margin: 0 auto;
	display: flex;
	align-items: center;
}
.lower_image{
	width: 40%;
	max-width: 300px;
}
.lower_hero_lead{
	width: 59%;
}
/********************* company 768 *********************/
#company .access{
	margin-bottom: 0;
}
#company .access .map_box{
	width: 100%;
	height: auto;
	padding-top: 400px;
	position: relative;
	margin: 0 auto;
}
#company .access .map_box .ggmap{
	position: absolute;
	width: 100%;
	height: 400px;
	top: 0;
	left: 0;
}
/********************* site_footer 768 *********************/

.site_footer .footer_nav{ 
	padding-top: 30px;
}
.site_footer .footer_nav li{
	padding: 5px 0;
}
.site_footer .footer_nav a{
	color: #333;
}
.footer_nav_list{
	display: flex;
	justify-content: center;
}
.site_footer_inner_wrap{
	width: 600px;
	margin: 0 auto;
	padding-bottom: 0;
}
.site_footer .footer_nav li{
	padding: 0px 20px;
}
.site_footer .salon_name_info{
	display: flex;
	justify-content: space-between;
	margin: 30px 0;
}

/************************************************************************************************************************/
/************************************************************************************************************************/
/************************************************************************************************************************/
/***********************************************************************************************************************/
/******************* レスポンシブ　768 ****************************/
/***************** hamburger 768 **************/

/***************** header 768 *******************/

/********************* about us 0 *********************/
}/*768 end*/
/***************************************************************************************************/
/***************************************************************************************************/
/***************************************************************************************************/
/**********                    ******                    ******                    *****************/
/**********   **************   ******   ***********************   **************   *****************/
/**********   **************   ******   ***********************   **************   *****************/
/**********   **************   ******   ***********************   **************   *****************/
/**********   **************   ******   ***********************   **************   *****************/
/**********                    ******                    ******   **************   *****************/
/***************************   ******   **************   ******   **************   *****************/
/***************************   ******   **************   ******   **************   *****************/
/***************************   ******   **************   ******   **************   *****************/
/***************************   ******   **************   ******   **************   *****************/
/**********                    ******                    ******                    ******************/
/***************************************************************************************************/
/***************************************************************************************************/
/***************************************************************************************************/
@media only screen and (min-width: 960px) {
/************************************************************************************************************************/
/************************************************************************************************************************/
/************************************************************************************************************************/
/***********************************************************************************************************************/
/******************* レスポンシブ　960 ****************************/
/*********************　common 960 *********************/
.header_inner,
.top .inner_wrap{
	width: 90%;
	max-width: 900px;
	margin: 0 auto;
}	
.top section{
	background-color: #fff;
	padding: 70px 0;
}
.top section.hero{
	padding: 0;
	padding-bottom: 50px;
}
.top section.salon{
	background: none;
}
.top h2,
#nail h2,
#eyelash h2{
	text-align: center;
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 400;
  font-size:  3rem;
  letter-spacing: 5px;
}
.top h2:before,
#nail h2:before,
#eyelash h2:before{
	content: "";
	display: inline-block;
	background: url(../images/common/deco_l.svg) no-repeat;
	background-size: 70px auto;
	width: 70px;
	height: 70px;
	vertical-align: middle;
	margin-right: 20px;
}
.top h2:after,
#nail h2:after,
#eyelash h2:after{
	content: "";
	display: inline-block;
	background: url(../images/common/deco_r.svg) no-repeat;
	background-size: 70px auto;
	width: 70px;
	height: 70px;
	vertical-align: middle;
	margin-left: 20px;
}
.top .section_subtitle{
	color: var(--pink);
	text-align: center;
	font-weight: 700;
	margin-bottom: 50px;
}
/***************** header 960 **************/
.site_header .pink_line{
	display: none;
}
.header{
	height: 0;
	position: fixed;
	z-index: 10000;
	top: 20px;
	background: none;
	height: auto;
	width: 100%;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  background-clip: padding-box;
  padding: 10px 20px; 
}
.site_header .header_brand{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10001;
	width: 90%;
	max-width: 1100px;
	 left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
.header_inner{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.header_logo{
	position: absolute;
}
.header_logo img{
	width: 200px;
	top: 10px;
	left: 20px;
}

#nav_drawer {
 position: absolute;
 z-index: 10000;
  top: 40px;
  right: auto;
  left: auto;
 	width:100%;
	background: url(../images/common/pink_line.png) no-repeat;
	background-size: 100% 50px;
	/*height: 50px;*/

}
.hamburger{
	display: none;
}
#nav_cover{
	display: none !important;
}
#nav_content {
	position: static;
	width: 100%;
	transition: none;
    -webkit-transform: translateX(0);
    transform: translateX(0);	
 	background: none;
}
#nav_content .nav_list{
	padding: 0;
	display: flex;
	justify-content: space-around;
	align-items: center;
	width: 600px;
	margin: 0 auto;
	padding-left: 30%;

}
#nav_content .nav_list li:first-child {
	padding-top: 0;
	background: none;
}
#nav_content ul li a{
	color: #333;
	border-bottom: none;
	line-height: 1;
	padding: 12px 0 20px;
	width: auto;
	font-weight: 700;
}
#nav_content ul li.nav_cta a{
	background-color: var(--pink);
	color: #fff;
	padding: 5px 15px;
	margin-top: -6px;
	border-radius: 50px;
}
/********************* hero 960 *********************/
.top .hero_title_image{
	width: 70%;
	max-width: 900px;
	margin: 0 auto;
	margin-top: -50px;
}
.top .hero_content .inner_wrap{
	width: 800px;
}
.top .hero_badge{
	font-size: 30px;
	padding: 5px 100px 5px 10px;
}
.top .hero_badge:after{
	position:absolute;
	right: 0;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
	content: "";
	border-top: 20px solid transparent;
  border-right: 20px solid #fff;
  border-bottom: 20px solid transparent;
}
.top .hero_catch{
	font-size: 25px;
}
.top .hero_catch br{
	display: none;
}
.top .hero_lead{
	font-size: 20px;
	line-height: 35px;
	margin-bottom: 50px;
}
.top .hero_video .movie{
	display: block;
	width: 90%;
	margin: 0 auto;
	max-width: 720px;
}
/***************** message 960 **************/
.top .message_body p{
	text-align: center;
	font-size: 18px;
	line-height: 40px;
}
.top .message_body p br{
	display: block;
}
/********************* service 960 *********************/
.top .service_item_inner{
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	padding: 30px 0;
}
.top .service_photo_nail img{
  display: none;
}
.top .service_item_nail{
	background: url(../images/top/nail_image.jpg) -15% 50% no-repeat;
	background-size: 60% auto;
}

.top .service_photo_eyelash img{
	display: none;
}

.top .service_item.service_item_eyelash{
	background: url(../images/top/eyelash_img.jpg) 115% 50% no-repeat;
	background-size: 60% auto;
}

.top .service_photo{
	width: 70%;
}
.top .service_text_wrap{
	width: 400px;
	margin: 0;
}
.top .link_more {
  position: relative;
  display: inline-block;
  color: var(--pink);
  text-decoration: none;
  padding-bottom: 10px;
}
.top .link_more .link_en {
  font-size: 20px;
  font-weight: 700;
  display: block;
  line-height: 1.2;
  display: block;
  padding-right: 20px;
  border-bottom: 1px solid var(--pink);
  position: relative;
}
.top .link_more .link_ja {
	line-height: 1;
  font-size: 13px;
  display: block;
  margin-top: 4px;
}
/********************* salon 960 *********************/
.top .salon_card .inner_wrap{
	width: 90%;
	padding-bottom: 30px;
}
.top .salon_logo .logo{
	width: 150px;	
	position: absolute;
	z-index: 10000;
	top: 0px;
	left: 30px;
}
.top .salon_logo .pink_line{
	position: absolute;
	z-index: 9999;
	top: 30px;
	width: 100%;	
	height: 40px;
}
.top .salon_flex{
	display: flex;
	justify-content: space-between;
}
.top .salon_txt{
	width: 47%;
}
.top .salon_photo{
	width: 45%;
}
.top .salon_name{
	font-weight: 700;
	text-align: center;
	margin-top: 30px;
	line-height: 1.5;
}
.top .salon_name_main{
	font-size: 40px;
	font-weight: 700;
}
.top .salon_info{
	margin: 20px 0;
}
/********************* access 960 *********************/
.top .access_badge{
	text-align: center;
	color: var(--pink);
	border: 1px solid var(--pink);
	border-radius: 50px;
	margin-bottom: 10px;
	font-size: 20px;
	width: 300px;
	margin: 0 auto;
	margin-bottom: 20px;
}
.top .access_block{
	width: 700px;
	margin: 0 auto;
	margin-bottom: 50px;
}
.top .reserve_message{
	width: 500px;
	margin: 0 auto;
	margin-bottom: 50px;
}
.top .access_text p br{
	display: block;
}
/********************* lower_hero 960 *********************/
.lower_hero .page_title{
	padding: 100px 0 50px;
}
.lower_hero .page_title_en img{
	width: 300px;
}
#eyelash .lower_hero .page_title_en img,
#company .lower_hero .page_title_en img{
	width: 400px;
}

.lower_hero .page_title_ja{
	display: block;
	font-weight: 700;
}
#nail .lower_hero_lead h2,
#nail .lower_hero_menu h2,
#eyelash .lower_hero_lead h2,
#eyelash .lower_hero_menu h2{
	font-size: 25px;
}
.lower_hero_lead p{
	line-height: 2 !important;
	font-weight: 600;
}

.lower_hero_menu ul{
	display: flex;
	justify-content: space-between;
}
.lower_hero_menu ul li{
	width: 27%;
}
#eyelash .lower_hero_menu ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#eyelash .lower_hero_menu ul li{
	width: 44%;
}
/********************* company 0 *********************/
#company .lower_hero_menu{
	padding: 100px 0  100px;
}
#company h2{
	font-size: 25px;
	font-weight: 700;
	letter-spacing: normal;
	text-align: center;
}
#company table .td_1{
	padding: 8px 0 8px 8px;
}
#company table .td_2{
	padding: 8px;
}
#company table .td_1,
#company table .td_2{
	padding: 15px 0px;
}
#company table{
	width: 90%;
	margin: 0 auto;
}
#company table .td_1{
	color: var(--pink);
	width: 20%;
}
#company table .td_2{
	width: 75%;
	line-height: 1.5rem;
}
#company table .td_2 ul{
	display: block;
}
#company table .td_2 ul li{
	padding: 0;
	margin-bottom: 15px;
	text-align: left;
	padding-left: 1rem;
	text-indent: -1rem;
	line-height: 1.5;
	display: block;
	width: 100%;
}
#company table .td_2 ul li br{
	display: block;
}

/********************* footer 960 *********************/
.reserve_box{
	width: 600px;
	margin: 0 auto;
	margin-bottom: 100px;
	display: flex;
	justify-content: space-around;
}
.footer_page_top a{
	top: -24px;
}
.site_footer .logo{
	width: 150px;
	position: absolute;
	top: -50px;
	left: 0;
	z-index: 10000;
}
.site_footer .footer_belt_inner_wrap{
	width: 960px;
}
.site_footer .pink_line{
	top: -25px;
	width: 100%;
	position: absolute;
	z-index: 9999;
	height: 40px;	
}
.site_footer .salon_name_info{
	width: 700px;
	margin: 0 auto;
	margin-top: 20px;
	margin-bottom: 50px;
}
.site_footer .salon_info{
	margin-top: 22px;
}
/***************** fv 960 **************/

}/*960 end*/
/***************************************************************************************************/
/***************************************************************************************************/
/***************************************************************************************************/
/**********   *****                    ******                    *****                    **********/
/**********   **********************   ******   **************   *****   **************   **********/
/**********   **********************   ******   **************   *****   **************   **********/
/**********   **********************   ******   **************   *****   **************   **********/
/**********   **********************   ******   **************   *****   **************   **********/
/**********   *****                    ******   **************   *****   **************   **********/
/**********   *****   ***********************   **************   *****   **************   **********/
/**********   *****   ***********************   **************   *****   **************   **********/
/**********   *****   ***********************   **************   *****   **************   **********/
/**********   *****                    ******                    *****                    **********/
/***************************************************************************************************/
/***************************************************************************************************/
/***************************************************************************************************/
@media only screen and (min-width: 1200px) {/*1200*/
/************************************************************************************************************************/
/************************************************************************************************************************/
/************************************************************************************************************************/
/***********************************************************************************************************************/
/******************* 1200 ****************************/
/***************** headeer 1200 **************/
.top .service .nail_txt_img{
	width: 300px;
}
.top .service .eyelash_txt_img{
	width: 350px;
}
/***************** fv 1200 **************/


/*********************　common 0 *********************/

}/*1200 end*/
@media only screen and (min-width: 1400px) {/*1500*/
/************************************************************************************************************************/
/************************************************************************************************************************/
/************************************************************************************************************************/
/***********************************************************************************************************************/
/******************* 1500 ****************************/
/***************** headeer 1500 **************/
.top .service_item_inner{
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 50px 0;
}
.top .service_item_nail{
	background: url(../images/top/nail_image.jpg) 0% 50% no-repeat;
	background-size: 50% auto;
}
.top .service_item.service_item_eyelash{
	background: url(../images/top/eyelash_img.jpg) 100% 50% no-repeat;
	background-size: 50% auto;
}
}/*1400 end*/
@media only screen and (min-width: 1600px) {/*1600*/
/************************************************************************************************************************/
/************************************************************************************************************************/
/************************************************************************************************************************/
/***********************************************************************************************************************/
/******************* 1600 ****************************/
/***************** headeer 1600 **************/
.top .hero_media{
	max-width: 1600px;
	margin: 0 auto;
}
}/*1900 end*/
@media only screen and (min-width: 1900px) {/*1900*/
/************************************************************************************************************************/
/************************************************************************************************************************/
/************************************************************************************************************************/
/***********************************************************************************************************************/
/******************* 1900 ****************************/
/***************** headeer 1900 **************/
.top .service_item_inner{
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 70px 0;
}
}/*1900 end*/
@media only screen and (min-width: 2000px) {/*2000*/
/************************************************************************************************************************/
/************************************************************************************************************************/
/************************************************************************************************************************/
/***********************************************************************************************************************/
/******************* 2000 ****************************/
/***************** headeer 2000 **************/
.top .service_item_inner{
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 100px 0;
}
}/*1900 end*/