@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Plus%20Jakarta%20Sans:wght@600&display=swap');
@import url('https://fonts.googleapis.com/icon?family=Material%20Icons');

/****************************************************************************/
/*                                                                          */
/* 共通                                                                      */
/*                                                                          */
/****************************************************************************/

/* commmon */
body { position:relative; color:#101010; line-height:1.8; font-family:Arial, '游ゴシック', 'Yu Gothic', YuGothic, sans-serif; font-size:14px; font-weight:400; font-feature-settings:'palt'; -webkit-text-size-adjust:100%; letter-spacing:0.08125rem; overflow-wrap: break-word; word-wrap:break-word; }
body { text-align:justify; }
body.modal::before { content:''; display:block; position:fixed; top:0; left:0; z-index:100; width:100%; height:100%; background:rgba(0,0,0,0.65); }

* { position:relative; box-sizing:border-box; }

::selection { color:#fff; background:#004EA2; }
::-moz-selection { color:#fff; background:#004EA2; }
::placeholder { color:rgba(16,16,16,0.35); font-family:Arial, '游ゴシック', 'Yu Gothic', YuGothic, sans-serif; }

a { color:#3391FF; text-decoration:underline; transition:0.25s; }
a:hover { transition:0.25s; }
a img { border:0; }
img { vertical-align:top; }
hr { margin:0 0 20px 0; padding:0; border:0; }
div { word-break:break-all; }
.material-icons { position:relative; top:0.2em; font-size:1.0em; }


.spacer-30 { display:block; clear:both; margin:0 0 -30px 0; padding:0; border:0; }
.spacer-20 { display:block; clear:both; margin:0 0 -20px 0; padding:0; border:0; }
.spacer-15 { display:block; clear:both; margin:0 0 -15px 0; padding:0; border:0; }
.spacer-10 { display:block; clear:both; margin:0 0 -10px 0; padding:0; border:0; }
.spacer-05 { display:block; clear:both; margin:0 0 -05px 0; padding:0; border:0; }
.spacer10 { display:block; clear:both; margin:0 0 10px 0; padding:0; border:0; }
.spacer20 { display:block; clear:both; margin:0 0 20px 0; padding:0; border:0; }
.spacer30 { display:block; clear:both; margin:0 0 30px 0; padding:0; border:0; }
.spacer40 { display:block; clear:both; margin:0 0 40px 0; padding:0; border:0; }
.spacer50 { display:block; clear:both; margin:0 0 50px 0; padding:0; border:0; }
.spacer60 { display:block; clear:both; margin:0 0 60px 0; padding:0; border:0; }
.spacer70 { display:block; clear:both; margin:0 0 70px 0; padding:0; border:0; }

.Inner { width:88%; max-width:88%; margin:0 auto; }
.PC { display:none; }
.SP { display:block; }
@media screen and (min-width:728px) { 
	.Inner { width:88%; max-width:1060px; margin:0 auto; }
	.PC { display:block; }
	.SP { display:none; }
}

/****************************************************************************/
/*                                                                          */
/* レイアウト																	*/
/*                                                                          */
/****************************************************************************/

/* common */
body { margin:0; padding:0; border:0; }
section, div, ol, ul { margin:0 0 10px 0; padding:0; border:0; }
p { margin:0 0 7px 0; padding:0; border:0; }
li { margin:0 0 0.5rem 0; padding:0; border:0; }

figure { display:block; margin:0 0 10px 0; padding:0; border:0; }
img { width:100%; height:100%; object-fit:cover; }

h1 { margin:0; padding:0; border:0; color:inherit; line-height:1.0; font-size:24px; font-weight:bolder; }
h2 { position:relative; margin:0 0 40px; padding:0; border:0; color:#68B557; line-height:1.5; font-size:20px; font-weight:bolder; text-align:center; }
h2::after { content:''; display:block; position:absolute; bottom:-10px; left:50%; width:160px; height:2px; background:#68B557; transform:translate(-50%,-50%); }
h3 { margin:0 0 10px; padding:0 1.0em; border:#68B557 1px solid; border-radius:4px; color:#68B557; line-height:50px; font-size:21px; font-weight:bolder; }
h4 { margin:0 0 10px; padding:0; border:0; font-size:18px; font-weight:bolder; }
h5 { margin:0 0 0.625rem; padding:0 0 0.5rem; border-bottom:rgba(159,159,159,0.5) 0.03rem solid; line-height:1.5; font-size:1.0rem; font-weight:bolder; }
h6 { margin:0 0 10px; padding:0; line-height:1.5; font-size:1.0em; font-weight:bolder; }

blockquote { margin:0 0 1.25rem; padding:0.9375rem 1.25rem; border:rgba(159,159,159,0.5) 0.03rem solid; border-radius:4px; font-size:0.875rem; font-style:italic; background:#fafafa; }
ul, ol { padding-left:2.0em; }
dl { display:flex;flex-flow:row wrap; justify-content:space-between; align-items:flex-start; }
dt { align-self:stretch; width:28.3333%; margin:0; padding:0.9375rem 1.25rem 0.9375rem 0.625rem; border-bottom:rgba(159,159,159,0.5) 0.03rem solid; font-weight:bolder; }
dt::before { content:''; display:inline-block; position:absolute; top:calc(0.8rem + 0.625rem); left:0; margin:0; padding:0; border:transparent 4px solid; border-left:#004EA2 4px solid; transform:translate(0,0); }
dd { align-self:stretch; width:71.6666%; margin:0; padding:0.9375rem 0 0.9375rem 0; border-bottom:rgba(159,159,159,0.5) 0.03rem solid; }
sup { position:relative; top: -0.15em; font-size:0.4em; }

table { width:100%; margin:0 0 10px 0; padding:0; border-top:#ddd 1px solid; border-collapse:collapse; font-size:13px; }
thead { color:#fff; font-weight:bolder; background:#68B557; }
tr {  border-bottom:#ddd 1px dotted; }
th { padding:3px 0.5em; font-weight:bold; text-align:left; }
tbody th { width:70px; color:#68B557; }
tbody th + td { width:110px; }
tbody th + td + td { width:110px; }
td { padding:3px 0.5em 3px 0; }
tr td:last-child { width:75px; text-align:center; background:#F8F4F4; }

/* Layout */
.cover { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
.cover---x1 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
.cover---x1 > * { display:flex; align-self:stretch; width:100.0%; }
.cover---x2 { display:flex; flex-flow:column wrap; justify-content:space-between; align-items:center; }
.cover---x2 > * { display:flex; align-self:stretch; width:calc(100% - 0px); }
.cover---x3 { display:flex; flex-flow:column wrap; justify-content:space-between; align-items:flex-start; padding:0; }
.cover---x3 > * { display:flex; align-self:stretch; width:calc(100.0% - 0px); }
.cover---x4 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
.cover---x4 > * { display:flex; align-self:stretch; width:calc(25% - 5px); }
.cover---x5 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
.cover---x5 > * { display:flex; align-self:stretch; width:calc(20% - 5px); }
.cover---x6 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
.cover---x6 > * { display:flex; align-self:stretch; width:calc(16.6666% - 5px); }


.cover---x2-1 { display:flex; flex-flow:column wrap; justify-content:space-between; align-items:flex-start; padding:0; }
.cover---x2-1 > * { display:flex; align-self:stretch; width:100%; }
.cover---x2-1 > * + * { display:flex; align-self:stretch; width:100%; }

.cover---x3-2 { display:flex; flex-flow:column wrap; justify-content:space-between; align-items:flex-start; padding:0; }
.cover---x3-2 > * { display:flex; align-self:stretch; width:calc(100.0% - 0px); margin-bottom:20px; }
.cover---x3-2 > * + * { display:flex; align-self:stretch; width:calc(100.0% - 0px); }

/* typography */
.textSize10 { font-size:1.0rem; } 
.textSize11 { font-size:1.1rem; } 
.textSize12 { font-size:1.2rem; } 
.textSize13 { font-size:1.3rem; } 
.align-center-sp { text-align:center; }

@media screen and (min-width:729px) {

	body { margin:0; padding:0; border:0; }
	section, div, ol, ul { margin:0 0 10px 0; padding:0; border:0; }
	p { margin:0 0 1.0em 0; padding:0; border:0; }
	li { margin:0 0 0.5rem 0; padding:0; border:0; }

	figure { display:block; margin:0 0 10px 0; padding:0; border:0; }
	img { width:100%; height:100%; object-fit:cover; }

	h1 { margin:0; padding:0; border:0; color:inherit; line-height:1.0; font-size:40px; font-weight:bolder; }
	h2 { position:relative; margin:0 0 40px; padding:0; border:0; color:#68B557; line-height:1.5; font-size:32px; font-weight:bolder; text-align:center; }
	h2::after { content:''; display:block; position:absolute; bottom:-10px; left:50%; width:220px; height:2px; background:#68B557; transform:translate(-50%,-50%); }
	h3 { width:100%; margin:0 0 10px; padding:0 1.0em; border:#68B557 1px solid; border-radius:4px; color:#68B557; line-height:50px; font-size:21px; font-weight:bolder; }
	h4 { margin:0 0 10px; padding:0; border:0; font-size:18px; font-weight:bolder; }
	h5 { margin:0 0 0.625rem; padding:0 0 0.5rem; border-bottom:rgba(159,159,159,0.5) 0.03rem solid; line-height:1.5; font-size:1.0rem; font-weight:bolder; }
	h6 { margin:0 0 10px; padding:0; line-height:1.5; font-size:1.0em; font-weight:bolder; }

	blockquote { margin:0 0 1.25rem; padding:0.9375rem 1.25rem; border:rgba(159,159,159,0.5) 0.03rem solid; border-radius:4px; font-size:0.875rem; font-style:italic; background:#fafafa; }
	ul, ol { padding-left:2.0em; }
	dl { display:flex;flex-flow:row wrap; justify-content:space-between; align-items:flex-start; }
	dt { align-self:stretch; width:28.3333%; margin:0; padding:0.9375rem 1.25rem 0.9375rem 0.625rem; border-bottom:rgba(159,159,159,0.5) 0.03rem solid; font-weight:bolder; }
	dt::before { content:''; display:inline-block; position:absolute; top:calc(0.8rem + 0.625rem); left:0; margin:0; padding:0; border:transparent 4px solid; border-left:#004EA2 4px solid; transform:translate(0,0); }
	dd { align-self:stretch; width:71.6666%; margin:0; padding:0.9375rem 0 0.9375rem 0; border-bottom:rgba(159,159,159,0.5) 0.03rem solid; }
	sup { position:relative; top: -0.15em; font-size:0.4em; }

	table { width:100%; margin:0 0 10px 0; padding:0; border-top:#ddd 1px solid; border-collapse:collapse; font-size:13px; }
	thead { color:#fff; font-weight:bolder; background:#68B557; }
	tr {  border-bottom:#ddd 1px dotted; }
	th { width:30%; padding:5px 1.0em; font-weight:bold; text-align:left; }
	tbody th { width:120px; color:#68B557; }
	td { padding:5px 1.0em; }
	tbody th + td { width:auto; }
	tbody th + td + td { width:auto; }
	tr td:last-child { text-align:center; white-space:nowrap; background:#F8F4F4; }

	/* Layout */
	.cover { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
	.cover---x1 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
	.cover---x1 > * { display:flex; align-self:stretch; width:100.0%; }
	.cover---x2 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
	.cover---x2 > * { display:flex; align-self:stretch; width:calc(49% - 10px); }
	.cover---x3 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-start; padding:0; }
	.cover---x3 > * { display:flex; align-self:stretch; width:calc(32.3333% - 10px); }
	.cover---x4 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
	.cover---x4 > * { display:flex; align-self:stretch; width:calc(25% - 5px); }
	.cover---x5 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
	.cover---x5 > * { display:flex; align-self:stretch; width:calc(20% - 5px); }
	.cover---x6 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; }
	.cover---x6 > * { display:flex; align-self:stretch; width:calc(16.6666% - 5px); }

	.cover---x2-1 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-start; padding:0; }
	.cover---x2-1 > * { display:flex; align-self:stretch; width:calc(55.0% - 10px); }
	.cover---x2-1 > * + * { display:flex; align-self:stretch; width:calc(45.0% - 10px); }

	.cover---x3-2 { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-start; padding:0; }
	.cover---x3-2 > * { display:flex; align-self:stretch; width:calc(30.0% - 10px); margin-bottom:0; }
	.cover---x3-2 > * + * { display:flex; align-self:stretch; width:calc(70.0% - 10px); }

	/* typography */
	.textSize10 { font-size:1.0rem; } 
	.textSize11 { font-size:1.1rem; } 
	.textSize12 { font-size:1.2rem; } 
	.textSize13 { font-size:1.3rem; } 
	.align-center-pc { text-align:center; }

}




/****************************************************************************/
/*                                                                          */
/* サイトヘッダ																*/
/*                                                                          */
/****************************************************************************/

/* Head */
.Head { margin-bottom:0; }
.Head figure { display:block; margin-bottom:0; padding:20px 0; text-align:center; }
.Head img { width:auto; height:26px; margin-bottom:0; object-fit:contain; }

/* mainNav */
	.trigger { display:block; position:fixed; top:0; right:0; z-index:205; width:50px; height:50px; background:rgba(255,255,255,0.9); cursor:pointer; }
	.trigger::before { content:''; display:block; position:absolute; top:50%; left:50%; width:16px; height:1px; background:#101010; box-shadow:0 -5px 0 0 #101010, 0 5px 0 0 #101010; transform:translate(-50%,-50%); }
	.trigger.active::before { content:''; display:block; position:absolute; top:50%; left:50%; width:16px; height:1px; background:#101010; box-shadow:none; transform:translate(-50%,-50%) rotate(45deg); }
	.trigger.active::after { content:''; display:block; position:absolute; top:50%; left:50%; width:16px; height:1px; background:#101010; box-shadow:none; transform:translate(-50%,-50%) rotate(-45deg); }

    .nav.active { display:flex; flex-flow:column wrap; justify-content:center; align-items:center; position:fixed; top:0; right:0; z-index:202; width:100%; height:100%; margin:0; padding:0; border-radius:8px; background:rgba(104,181,87,0.95); }
	.navInner { display:none; width:100%; }
	.navInner.active { display:block; }
	.nav .navHead { display:none; }
	.nav ul { width:100%; margin:0; padding:0; list-style:none; }
	.nav li { margin:0; }
	.nav li a { display:block; width:100%; padding:8px 0 8px 25px; border-bottom:rgba(255,255,255,0.5) 1px solid; color:#fff; text-decoration:none; background:transparent; }
		.nav li:nth-child(4) a,
		.nav li:nth-child(5) a,
		.nav li:nth-child(6) a { padding-left:35px; }
		.nav li:last-child a { border-radius:0 0 8px 8px; }
	.nav li .material-icons { position:absolute; top:0.75em; left:10px; color:#fff; }
		.nav li:nth-child(4) .material-icons,
		.nav li:nth-child(5) .material-icons,
		.nav li:nth-child(6) .material-icons { position:absolute; top:0.75em; left:20px; color:rgba(255,255,255,0.5); }
	.navInner a:hover,
	.navInner a.active { background:rgba(255,255,255,0.15); transition:0.25s; }

/* .MainVisual */
.MainVisual { width:100%; margin-bottom:8px; }
.MainVisual .photo { width:100%; height:100%; padding:0; }
.MainVisual .photo img { width:100%; height:100%; min-height:300px; object-fit:cover; }
.MainVisual .textBox { position:absolute; top:50%; left:50%; width:88%; max-width:1060px; height:80%; transform:translate(-50%,-50%); color:#fff; }
.MainVisual h1 { margin-bottom:10px; }
.MainVisual h1 + p { font-size:16px; font-weight:bolder; }
.note { margin-bottom:40px; }

@media screen and (min-width:729px) {
	/* Head */
	.Head { margin-bottom:5px; }
	.Head figure { display:block; margin-bottom:0; padding:20px 0; text-align:center; }
	.Head img { width:auto; height:30px; margin-bottom:0; object-fit:contain; }

	/* mainNav */
	.trigger { display:block; position:fixed; top:12.5%; right:20px; width:40px; height:40px; border-radius:4px; background:#68B557; }
		.trigger::before { background:#fff; box-shadow:0 -5px 0 0 #fff, 0 5px 0 0 #fff; }
		.trigger::after { background:#fff; }
	.trigger.active::before,
	.trigger.active::after { background:#fff; }

	.nav { position:fixed; top:270px; right:-100%; z-index:202; width:220px; height:auto; margin:0; padding:0; border-radius:8px; background:#68B557; transition:0.3s; opacity:0.9; }
	.nav.active { position:fixed; top:270px; right:20px; z-index:202; width:220px; height:auto; margin:0; padding:0; border-radius:8px; background:#68B557; transition:0.3s; }
	.navInner { display:block; margin:0; }
	.nav .navHead { display:block; margin:0; padding:0 1.0em; color:#fff; line-height:50px; font-size:16px; text-align:left; }
	.nav ul { width:100%; margin:0; padding:0; list-style:none; }
	.nav li { margin:0 1px 1px; }
	.nav li a { display:block; width:100%; padding:8px 1.0em 8px 25px;border-bottom:0; color:#101010; text-decoration:none; background:#fff; }
		.nav li:nth-child(4) a,
		.nav li:nth-child(5) a,
		.nav li:nth-child(6) a { padding-left:35px; }
		.nav li:last-child a { border-radius:0 0 8px 8px; }
	.nav li .material-icons { position:absolute; top:0.75em; left:10px; color:#68B557; }
		.nav li:nth-child(4) .material-icons,
		.nav li:nth-child(5) .material-icons,
		.nav li:nth-child(6) .material-icons { position:absolute; top:0.75em; left:20px; color:#ADADAD; }
	.navInner a:hover,
	.navInner a.active { background:rgba(255,255,255,0.15); transition:0.25s; }

	/* .MainVisual */
	.MainVisual { width:100%; margin-bottom:8px; }
	.MainVisual .photo { width:100%; height:100%; padding:0; }
	.MainVisual .photo img { width:100%; height:100%; min-height:400px; object-fit:cover; }
	.MainVisual .textBox { position:absolute; top:50%; left:50%; width:88%; max-width:1060px; height:auto; transform:translate(-50%,-50%); color:#fff; }
	.MainVisual h1 { margin-bottom:10px; }
	.MainVisual h1 + p { font-size:25px; font-weight:bolder; }
	.note { margin-bottom:55px; }
}
@media screen and (min-width:1600px) {
	.trigger { display:none; }
	.nav { position:fixed; top:270px; right:20px; z-index:202; width:220px; height:auto; margin:0; padding:0; border-radius:8px; background:#68B557; transition:0.3s; opacity:0.9; }

}

/****************************************************************************/
/*                                                                          */
/* イントロ																	*/
/*                                                                          */
/****************************************************************************/

.Intro { width:100%; }
.Intro .Inner { width:88%; margin:0 auto; padding:0; }
.Intro h3 { WIDTH:100%; margin:0 0 5px; padding:0; border:0; color:#101010; line-height:1.5; font-size:18px; font-weight:bolder; }
.Point { display:flex; flex-flow:column wrap; justify-content:space-between; align-items:flex-start; max-width:760px; margin:40px auto 50px; padding:0; }
.Point li { align-self:stretch; display:flex; flex-flow:column wrap; justify-content:center; align-items:flex-start; width:100%; margin:0; padding:10px 20px 20px 20px; border:#68B557 3px solid; border-radius:8px; }
.Point li:first-child { margin-bottom:15px; }
.Point dl { display:flex; flex-flow:column wrap; justify-content:center; align-items:flex-start; width:100%; margin:0; text-align:center; }
.Point dt { position:relative; width:100%; min-height:100px; padding:0; border-color:#68B557; line-height:100px; font-size:18px; font-weight:bolder; }
.Point dt::before { content:none; }
.Point dt span { position:absolute; z-index:-1; top:50%; left:50%; color:#C1DFBA; line-height:1; font-family:'Plus Jakarta Sans', sans-serif; font-size:90px; font-weight:bolder; transform:translate(-50%,-50%); }
.Point dd { width:100%; min-height:110px; padding-bottom:0; border:0; font-size:21px; font-weight:bolder; }
.tableWrap { display:flex; flex-flow:column wrap; justify-content:space-between; align-items:flex-start; width:100%; margin-bottom:40px; }
.tableWrap table { width:100%; margin:0; font-size:12px; }
.tableWrap table.adjust { margin-bottom:10px; border-top:0; }
.tableWrap table.adjust thead { display:none; }
.tableWrap br { display:inline; }

@media screen and (min-width:729px) {
	.Intro { width:88%; max-width:1060px; margin:0 auto; }
	.Intro .Inner { width:100%; margin-bottom:0; padding:0; }
	.Intro h3 { WIDTH:50%; margin:0 0 5px; padding:0; border:0; color:#101010; line-height:1.5; font-size:21px; font-weight:bolder; }
	.Point { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-start; max-width:760px; margin:40px auto 50px; padding:0; }
	.Point li { align-self:stretch; display:flex; flex-flow:column wrap; justify-content:center; align-items:flex-start; width:47%; margin:0; padding:30px 30px; border:#68B557 3px solid; border-radius:8px; }
	.Point li:first-child { margin-bottom:0; }
	.Point dl { display:flex; flex-flow:column wrap; justify-content:center; align-items:flex-start; width:100%; margin:0; text-align:center; }
	.Point dt { position:relative; width:100%; min-height:100px; padding:0; border-color:#68B557; line-height:100px; font-size:18px; font-weight:bolder; }
	.Point dt::before { content:none; }
	.Point dt span { position:absolute; z-index:-1; top:50%; left:50%; color:#C1DFBA; line-height:1; font-family:'Plus Jakarta Sans', sans-serif; font-size:90px; font-weight:bolder; transform:translate(-50%,-50%); }
	.Point dd { width:100%; min-height:110px; padding-bottom:0; border:0; font-size:21px; font-weight:bolder; }
	.tableWrap { display:flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-start; width:100%; margin-bottom:80px; }
	.tableWrap table { width:49.5%; margin-bottom:10px; font-size:13px; }
	.tableWrap table.adjust { margin-bottom:10px; border-top:#ddd 1px solid; }
	.tableWrap table.adjust thead { display:table-header-group; }
	.tableWrap br { display:none; }
}

/****************************************************************************/
/*                                                                          */
/* 乳剤の作用																	*/
/*                                                                          */
/****************************************************************************/

.Action { margin-bottom:40px; }
.Action figure { margin-top:20px; margin-bottom:25px; }

@media screen and (min-width:729px) {
	.Action { margin-bottom:80px; }
	.Action figure { margin-top:20px; margin-bottom:40px; }
}

/****************************************************************************/
/*                                                                          */
/* 乳剤の上手な使い方															*/
/*                                                                          */
/****************************************************************************/

.Usage { margin-bottom:40px; }
.Usage .cover---x3-2 { align-items:center; margin-bottom:0px; }
.Usage .cover---x3-2.adjust { margin-bottom:0; }
.Usage figure { width:100%; margin:0; }
.Usage img { height:auto; object-fit:contain; }
.Usage h2 br { display:inline; }
.Usage h2 + p { margin-bottom:30px; }
.Usage .text { align-self:auto; flex-flow:column wrap; }
.Usage .reverse > * { order:1; }
.Usage .reverse > * + * { order:2; }
.Usage h3 { margin-bottom:30px; }
.Usage .cover---x3 { margin-bottom:0px; }
.Usage .cover---x3 li { flex-flow:column wrap; }
.Usage .cover---x3 figure { align-self:self-start; margin-bottom:20px; }
.Usage .cover---x3 img { width:100%; height:100%; object-fit:cover; }
.Usage figure.dosage { margin:50px 0 30px; }
.Usage .cover---x2 { margin-bottom:5px; padding:0; }
.Usage .cover---x2 li { flex-flow:column wrap; }
.Usage .cover---x2 figure { align-self:self-start; margin-bottom:25px; }

@media screen and (min-width:729px) {
	.Usage { margin-bottom:80px; }
	.Usage .cover---x3-2 { flex-flow:row wrap; align-items:center; margin-bottom:30px; }
	.Usage .cover---x3-2.adjust { margin-bottom:0; }
	.Usage figure { margin:0; }
	.Usage img { height:auto; object-fit:contain; }
	.Usage h2 br { display:none; }
	.Usage h2 + p { margin-bottom:30px; }
	.Usage .text { align-self:auto; flex-flow:column wrap; }
	.Usage .reverse > * { order:2; }
	.Usage .reverse > * + * { order:1; }
	.Usage h3 { margin-bottom:30px; }
	.Usage .cover---x3 { margin-bottom:30px; }
	.Usage .cover---x3 li { flex-flow:column wrap; }
	.Usage .cover---x3 figure { align-self:self-start; width:100%; margin-bottom:25px; }
	.Usage figure.dosage { margin:50px 0 30px; }
	.Usage .cover---x2 { margin-bottom:30px; padding:0; }
	.Usage .cover---x2 li { flex-flow:column wrap; }
	.Usage .cover---x2 figure { align-self:self-start; width:100%; margin-bottom:25px; }
}

/****************************************************************************/
/*                                                                          */
/* 乳剤の作用																	*/
/*                                                                          */
/****************************************************************************/

.FAQ { margin-bottom:80px; }
.FAQ ul { padding:0; list-style:none; }
.FAQ li { margin-bottom:15px; }
.FAQ dl { flex-flow:column wrap; margin:0; }
.FAQ dt { position:relative; width:100%; padding:12px 1.0em 12px 35px; border:#D5D5D5 1px solid; border-radius:4px; font-weight:bolder; }
.FAQ dt::before { content:none; }
.FAQ dt::before { content:''; display:block; position:absolute; top:50%; right:15px; left:auto; width:11px; height:1px; margin:0; padding:0; border:0; background:#68B557; }
.FAQ dt::after { content:''; display:block; position:absolute; top:50%; right:15px; width:11px; height:1px; margin:0; padding:0; border:0; background:#68B557; transform:rotate(90deg); transition:0.25s; }
.FAQ dt.active::after { content:''; display:block; position:absolute; top:50%; right:15px; width:11px; height:1px; margin:0; padding:0; border:0; background:transparent; transform:rotate(0deg); transition:0.25s; }
.FAQ dt br { display:inline; }
.FAQ dt b { display:inline-block; position:absolute; left:0.6em; margin-right:0.5em; color:#68B557; line-height:1.2; font-family:'Plus Jakarta Sans', sans-serif; font-size:1.4em; font-weight:bolder; }
.FAQ dd { display:flex; flex-flow:row wrap; justify-content: space-between; align-items:flex-start; width:100%; margin-bottom:0; padding:20px 0 0; border:0; }
.FAQ dd b { display:block; width:20px; padding-left:0; color:#878787; line-height:1.4; font-size:1.3em; }
.FAQ dd .text { width:calc(100% - 20px); }

@media screen and (min-width:729px) {
	.FAQ { margin-bottom:80px; }
	.FAQ ul { padding:0; list-style:none; }
	.FAQ li { margin-bottom:15px; }
	.FAQ dl { flex-flow:column wrap; margin:0; }
	.FAQ dt { position:relative; width:100%; padding:12px 1.0em; border:#D5D5D5 1px solid; border-radius:4px; font-weight:bolder; }
	.FAQ dt::before { content:none; }
	.FAQ dt::before { content:''; display:block; position:absolute; top:50%; right:15px; left:auto; width:11px; height:1px; margin:0; padding:0; border:0; background:#68B557; }
	.FAQ dt::after { content:''; display:block; position:absolute; top:50%; right:15px; width:11px; height:1px; margin:0; padding:0; border:0; background:#68B557; transform:rotate(90deg); transition:0.25s; }
	.FAQ dt.active::after { content:''; display:block; position:absolute; top:50%; right:15px; width:11px; height:1px; margin:0; padding:0; border:0; background:transparent; transform:rotate(0deg); transition:0.25s; }
	.FAQ dt br { display:none; }
	.FAQ dt b { display:inline-block; position:relative; left:auto; margin-right:0.5em; color:#68B557; line-height:1.2; font-family:'Plus Jakarta Sans', sans-serif; font-size:1.4em; font-weight:bolder; }
	.FAQ dd { display:flex; flex-flow:row wrap; justify-content: space-between; align-items:flex-start; width:100%; margin-bottom:0; padding:20px 0 0; border:0; }
	.FAQ dd b { display:block; width:50px; padding-left:1.0em; color:#878787; line-height:1.4; font-size:1.3em; }
	.FAQ dd .text { width:calc(100% - 50px); }
}

/****************************************************************************/
/*                                                                          */
/* フッタエリア                                                               */
/*                                                                          */
/****************************************************************************/

.Foot { width:100%; margin:0; padding:40px 0; color:#fff; text-align:center; background:#68B557; }
.pageTop { position:fixed; right:0; bottom:0; z-index:100; width:60px; height:60px; background:rgba(104,181,87,0.8); }
.pageTop::before { content:''; display:block; position:absolute; top:50%; left:55%; width:5px; height:5px; border-top:#fff 2px solid; border-right:#fff 2px solid; transform:rotate(-45deg) translate(-50%,-50%); }

.Foot dl { display:block; margin:0; }
.Foot dt { width:100%; margin:0 0 10px 0; padding:0; border:0; font-size:20px; font-weight:bolder; }
.Foot dt small { display:block; position:relative; margin-bottom:25px; padding-bottom:25px; font-size:16px; font-weight:normal; }
.Foot dt small::after { content:''; display:block; position:absolute; bottom:0; left:50%; width:220px; height:1px; background:#fff; transform:translate(-50%,0); }
.Foot dt::before { content:none; }
.Foot dd { width:100%; margin:0; padding:0; border:0; }
.Foot dd b { display:block; font-size:19px; font-weight:bolder; }
.Foot dd a { display:block; font-size:27px; font-weight:bolder; }
.Foot dd small { display:inline-block; margin-right:10px; font-size:15px; }
.Foot ul { display:inline-block; width:auto; margin:0; margin-top:20px; padding:0; list-style:none; }
.Foot li { display:inline-block; width:auto; margin:0; line-height:1.0; }
.Foot li:last-child { margin-left:1.0em; padding-left:1.0em; border-left:#fff 1px solid; }
.Foot a { color:#fff; text-decoration:none; }

@media screen and (min-width:729px) {

	/* .Foot */
	.Foot { width:100%; margin:0; padding:80px 0; color:#fff; text-align:center; background:#68B557; }
	.pageTop { position:fixed; right:0; bottom:0; z-index:100; width:60px; height:60px; background:rgba(104,181,87,1); mix-blend-mode:multiply; }
	.pageTop::before { content:''; display:block; position:absolute; top:50%; left:55%; width:5px; height:5px; border-top:#fff 2px solid; border-right:#fff 2px solid; transform:rotate(-45deg) translate(-50%,-50%); }

	.Foot dl { display:block; margin:0; }
	.Foot dt { width:100%; margin:0 0 10px 0; padding:0; border:0; font-size:32px; font-weight:bolder; }
	.Foot dt small { display:block; position:relative; margin-bottom:40px; padding-bottom:40px; font-size:18px; font-weight:normal; }
	.Foot dt small::after { content:''; display:block; position:absolute; bottom:0; left:50%; width:220px; height:1px; background:#fff; transform:translate(-50%,0); }
	.Foot dt::before { content:none; }
	.Foot dd { width:100%; margin:0; padding:0; border:0; }
	.Foot dd b { display:block; font-size:21px; font-weight:bolder; }
	.Foot dd a { display:block; font-size:29px; font-weight:bolder; }
	.Foot dd small { display:inline-block; margin-right:10px; font-size:17px; }
	.Foot ul { display:inline-block; width:auto; margin:0; margin-top:35px; padding:0; list-style:none; }
	.Foot li { display:inline-block; width:auto; margin:0; line-height:1.0; }
	.Foot li:last-child { margin-left:1.0em; padding-left:1.0em; border-left:#fff 1px solid; }
	.Foot a { color:#fff; text-decoration:none; }
	.Foot a.call { pointer-events:none; }
}