/* -------------------------------------------------------------------------------------------------------------

	style.css

------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------

	PC / PRINT

------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width: 769px), print {
	/* -------------------------------------------------------------------------------------------------------*/
	/* c3CmnTtl01
	-----------------------------------------------------------------*/
	.c3CmnTtl01 {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/ico_water01.png");
	}
	/* c3CmnTtl02
	-----------------------------------------------------------------*/
	.c3CmnTtl02 {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/ico_water01.png");
	}
	/* c3CmnBg01
	-----------------------------------------------------------------*/
	.c3CmnBg01 {
		background: #e5f2ff;
	}
	.c3CmnBg01:before {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_hr01.png");
	}
	.c3CmnBg01:after {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_hr02.png");
	}
	/* c3Mv
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Mv {
		height: 550px;
		background: url("/-/Media/com/c3/top/190426/prod2_o2/bg_mv01.jpg") no-repeat center;
		background-size: cover;
		position: relative;
	}
	.prod2_o2 .c3Mv .c3MvTxt01, .prod2_o2 .c3Mv .c3MvImg01 {
		position: absolute;
	}
	.prod2_o2 .c3Mv .c3MvTxt01 {
		left: calc(50% - 275px);
		top: 47px;
	}
	.prod2_o2 .c3Mv .c3MvImg01 {
		left: calc(50% - 152px);
		bottom: 35px;
	}
	/* c3CmnLnav
	-----------------------------------------------------------------*/
	.prod2_o2 #c3CmnLnav {
		background: #0071da;
	}
	.prod2_o2 #c3CmnLnav .c3CmnLnavBtn01 a span:after {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/ico_arrow03_r.png");
	}
	/* c3TxtArea01
	-----------------------------------------------------------------*/
	.prod2_o2 .c3TxtArea01 {
		width: 940px;
		margin: 0 auto;
		padding: 45px 0;
		text-align: center;
	}
	.prod2_o2 .c3TxtArea01 dt {
		color: #0071da;
		font-size: 2.4rem;
		font-weight: 700;
		line-height: 1.69;
	}
	.prod2_o2 .c3TxtArea01 dd {
		font-size: 1.8rem;
		line-height: 1.78;
		margin: 8px 0 0;
	}
	/* c3Box01
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Box01Ttl01 {
		color: #fff;
		background: #0071da;
		font-size: 2.0rem;
		font-weight: 700;
		text-align: center;
		padding: 23px 0 0;
	}
	.prod2_o2 .c3Box01Ttl01:after {
		content: "";
		display: block;
		width: 100%;
		height: 25px;
		background: url("/-/Media/com/c3/top/190426/prod2_o2/bg_boxhr01.png") no-repeat center bottom;
		background-size: cover;
		margin: 20px 0 0;
		position: relative;
		bottom: -1px;
	}
	.prod2_o2 .c3Box01img01 {
		text-align: center;
	}
	/* c3Blc01
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Blc01 {
		padding: 0 4% 30px;
	}
	.prod2_o2 .c3Blc01Inner01 {
		display: flex;
		justify-content: space-between;
	}
	.prod2_o2 .c3Blc01 .c3Blc01Txt01 {
		width: 455px;
	}
	.prod2_o2 .c3Blc01 .c3Blc01Txt01 p {
		font-size: 1.6rem;
		line-height: 1.88;
	}
	.prod2_o2 .c3Blc01 .c3Blc01Txt01 p + p {
		margin-top: 0.5em;
	}
	.prod2_o2 .c3Blc01 .c3CmnBox01 {
		width: 455px;
	}
	.prod2_o2 .c3Box02Ttl01 {
		color: #fff;
		background: #0071da;
		font-size: 2.0rem;
		font-weight: 700;
		line-height: 1.4;
		text-align: center;
		padding: 12px 0 0;
	}
	.prod2_o2 .c3Box02Ttl01:after {
		content: "";
		display: block;
		width: 100%;
		height: 25px;
		background: url("/-/Media/com/c3/top/190426/prod2_o2/bg_boxhr02.png") no-repeat center bottom;
		background-size: cover;
		position: relative;
		bottom: -1px;
	}
	/* c3Box02
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Box02Wrap {
		padding-top: 0;
	}
	.prod2_o2 .c3Box02 {
		position: relative;
	}
	.prod2_o2 .c3Box02Txt01, .prod2_o2 .c3Box02Txt02, .prod2_o2 .c3Box02Txt03 {
		position: absolute;
	}
	.prod2_o2 .c3Box02Txt01 {
		display: table;
		color: #fff;
		font-weight: 700;
		background: #105db8;
		border-radius: 50%;
		width: 90px;
		height: 90px;
		top: 16px;
		left: 60px;
	}
	.prod2_o2 .c3Box02Txt01 span {
		display: table-cell;
		text-align: center;
		vertical-align: middle;
	}
	.prod2_o2 .c3Box02Txt02, .prod2_o2 .c3Box02Txt03 {
		width: 31.07vw;
		font-size: 1.3rem;
		font-weight: 700;
		color: #0071da;
		left: 264px;
	}
	.prod2_o2 .c3Box02Txt02 {
		top: 50px;
	}
	.prod2_o2 .c3Box02Txt03 {
		top: 121px;
	}
	.prod2_o2 .c3Box02img01 {
		text-align: center;
	}
	/* c3Howto
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Howto:before {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_hr01.png");
	}
	.prod2_o2 .c3Howto:after {
		display: none;
	}
	.prod2_o2 .c3HowtoInner {
		display: flex;
		justify-content: space-between;
	}
	.prod2_o2 .c3HowtoBox01 {
		width: 455px;
	}
	.prod2_o2 .c3HowtoTxt01, .prod2_o2 .c3HowtoTxt02 {
		display: table;
		width: 100%;
		height: 60px;
		background: #fff;
	}
	.prod2_o2 .c3HowtoTxt01 span, .prod2_o2 .c3HowtoTxt02 span {
		display: table-cell;
		vertical-align: middle;
		font-weight: 700;
		line-height: 1.38;
	}
	.prod2_o2 .c3HowtoTxt01 span:first-child, .prod2_o2 .c3HowtoTxt02 span:first-child {
		font-size: 1.5rem;
		color: #fff;
		padding: 0 0 0 39px;
		text-align: center;
		width: 80px;
		box-sizing: border-box;
	}
	.prod2_o2 .c3HowtoTxt01 span:first-child {
		background: #0071da url("/-/Media/com/c3/top/190426/prod2_o2/ico_howto01.png") no-repeat 17px center;
		background-size: 25px auto;
	}
	.prod2_o2 .c3HowtoTxt02 span:first-child {
		background: #f18200 url("/-/Media/com/c3/top/190426/prod2_o2/ico_howto02.png") no-repeat 13px center;
		background-size: 33px auto;
	}
	.prod2_o2 .c3HowtoTxt01 span:last-child, .prod2_o2 .c3HowtoTxt02 span:last-child {
		font-size: 1.8rem;
		background: no-repeat left center;
		background-size: auto 100%;
		padding: 5px 30px 5px 20px;
	}
	.prod2_o2 .c3HowtoTxt01 span:last-child {
		color: #0071da;
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_howto_hr01.png");
	}
	.prod2_o2 .c3HowtoTxt02 span:last-child {
		color: #f18200;
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_howto_hr02.png");
	}
	.prod2_o2 .c3HowtoBox02 {
		display: flex;
		justify-content: space-between;
		margin: 20px 0 0;
	}
	.prod2_o2 .c3HowtoBox02 ul {
		width: 376px;
		margin: -0.4em 0 0;
	}
	.prod2_o2 .c3HowtoBox02 ul li {
		line-height: 1.57;
		padding: 0 0 0 1.79em;
		margin: 10px 0 0;
		position: relative;
	}
	.prod2_o2 .c3HowtoBox02 ul li:first-child {
		margin-top: 0;
	}
	.prod2_o2 .c3HowtoBox02 ul li span {
		display: table;
		width: 20px;
		height: 20px;
		border-radius: 50%;
		background: #0071da;
		font-size: 1.2rem;
		font-weight: 700;
		color: #fff;
		position: absolute;
		left: 0;
	}
	.prod2_o2 .c3HowtoBox01 + .c3HowtoBox01 .c3HowtoBox02 ul li span {
		background: #f18200;
	}
	.prod2_o2 .c3HowtoBox02 ul li span span {
		display: table-cell;
		vertical-align: middle;
		text-align: center;
	}
	.prod2_o2 .c3HowtoBox02 div {
		width: 70px;
	}
	/* -------------------------------------------------------------------------------------------------------*/
}
/* -------------------------------------------------------------------------------------------------------------

	PC

------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width: 769px) {
	/* -------------------------------------------------------------------------------------------------------*/
	/* -------------------------------------------------------------------------------------------------------*/
}
/* -------------------------------------------------------------------------------------------------------------

	TAB

------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width: 481px) and (max-width: 768px) {
	/* -------------------------------------------------------------------------------------------------------*/
	/* -------------------------------------------------------------------------------------------------------*/
}
/* -------------------------------------------------------------------------------------------------------------

	SP / TAB

------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
	/* -------------------------------------------------------------------------------------------------------*/
	/* c3CmnTtl01
	-----------------------------------------------------------------*/
	.c3CmnTtl01 {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/ico_water01.png");
	}
	/* c3CmnTtl02
	-----------------------------------------------------------------*/
	.c3CmnTtl02 {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/ico_water01.png");
	}
	/* c3CmnBg01
	-----------------------------------------------------------------*/
	.c3CmnBg01 {
		background: #e5f2ff;
	}
	.c3CmnBg01:before {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_hr01_sp.png");
	}
	.c3CmnBg01:after {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_hr02_sp.png");
	}
	/* c3Mv
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Mv {
		padding: 100vw 0 0;
		background: url("/-/Media/com/c3/top/190426/prod2_o2/bg_mv01_sp.jpg") no-repeat center;
		background-size: cover;
		position: relative;
	}
	.prod2_o2 .c3Mv .c3MvTxt01, .prod2_o2 .c3Mv .c3MvImg01 {
		position: absolute;
	}
	.prod2_o2 .c3Mv .c3MvTxt01 {
		width: 89.33vw;
		left: calc(50% - 44.67vw);
		top: 9.33vw;
	}
	.prod2_o2 .c3Mv .c3MvImg01 {
		width: 53.07vw;
		left: calc(50% - 26.53vw);
		bottom: 6.67vw;
	}
	/* c3CmnLnav
	-----------------------------------------------------------------*/
	.prod2_o2 #c3CmnLnav {
		background: #0071da;
	}
	.prod2_o2 #c3CmnLnav .c3CmnLnavBtn01 a span:after {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/ico_arrow03_r.png");
	}
	/* c3TxtArea01
	-----------------------------------------------------------------*/
	.prod2_o2 .c3TxtArea01 {
		padding: 22px 4%;
		text-align: center;
	}
	.prod2_o2 .c3TxtArea01 dt {
		color: #0071da;
		font-size: 1.8rem;
		font-weight: 700;
		line-height: 1.69;
	}
	.prod2_o2 .c3TxtArea01 dd {
		font-size: 1.6rem;
		line-height: 1.69;
		margin: 8px 0 0;
	}
	/* c3Box01
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Box01img01 {
		width: 68.4vw;
		margin: 0 auto;
	}
	/* c3Box01
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Box01Ttl01 {
		color: #fff;
		background: #0071da;
		font-size: 1.8rem;
		font-weight: 700;
		line-height: 1.33;
		text-align: center;
		padding: 15px 0 0;
	}
	.prod2_o2 .c3Box01Ttl01:after {
		content: "";
		display: block;
		width: 100%;
		height: 6.67vw;
		background: url("/-/Media/com/c3/top/190426/prod2_o2/bg_boxhr01_sp.png") no-repeat center bottom;
		background-size: cover;
		margin: 5px 0 0;
		position: relative;
		bottom: -1px;
	}
	/* c3Blc01
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Blc01 {
		padding: 0 4% 30px;
	}
	.prod2_o2 .c3Blc01 .c3Blc01Txt01 p {
		font-size: 1.6rem;
		line-height: 1.69;
	}
	.prod2_o2 .c3Blc01 .c3Blc01Txt01 p + p {
		margin-top: 0.5em;
	}
	.prod2_o2 .c3Blc01 .c3CmnBox01 {
		margin: 25px 0 0;
	}
	.prod2_o2 .c3Box02Ttl01 {
		color: #fff;
		background: #0071da;
		font-size: 1.8rem;
		font-weight: 700;
		line-height: 1.33;
		text-align: center;
		padding: 15px 0 0;
	}
	.prod2_o2 .c3Box02Ttl01:after {
		content: "";
		display: block;
		width: 100%;
		height: 6.67vw;
		background: url("/-/Media/com/c3/top/190426/prod2_o2/bg_boxhr01_sp.png") no-repeat center bottom;
		background-size: cover;
		margin: 5px 0 0;
		position: relative;
		bottom: -1px;
	}
	.prod2_o2 .c3Box02 {
		position: relative;
	}
	.prod2_o2 .c3Box02Txt01, .prod2_o2 .c3Box02Txt02, .prod2_o2 .c3Box02Txt03 {
		position: absolute;
	}
	.prod2_o2 .c3Box02Txt01 {
		display: table;
		color: #fff;
		font-size: 1.2rem;
		font-weight: 700;
		background: #105db8;
		border-radius: 50%;
		width: 20vw;
		height: 20vw;
		top: 5.47vw;
		left: 3.07vw;
	}
	.prod2_o2 .c3Box02Txt01 span {
		display: table-cell;
		text-align: center;
		vertical-align: middle;
	}
	.prod2_o2 .c3Box02Txt02, .prod2_o2 .c3Box02Txt03 {
		width: 31.07vw;
		font-size: 1.3rem;
		font-weight: 700;
		color: #0071da;
		left: 52.67vw;
	}
	.prod2_o2 .c3Box02Txt02 {
		top: 17.13vw;
	}
	.prod2_o2 .c3Box02Txt03 {
		top: 36.33vw;
	}
	/* c3Howto
	-----------------------------------------------------------------*/
	.prod2_o2 .c3Howto:before {
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_hr03_sp.png");
	}
	.prod2_o2 .c3Howto:after {
		display: none;
	}
	.prod2_o2 .c3HowtoBox01 + .c3HowtoBox01 {
		margin: 20px 0 0;
	}
	.prod2_o2 .c3HowtoTxt01, .prod2_o2 .c3HowtoTxt02 {
		display: table;
		width: 100%;
		background: #fff;
	}
	.prod2_o2 .c3HowtoTxt01 span, .prod2_o2 .c3HowtoTxt02 span {
		display: table-cell;
		vertical-align: middle;
		font-weight: 700;
		line-height: 1.38;
	}
	.prod2_o2 .c3HowtoTxt01 span:first-child, .prod2_o2 .c3HowtoTxt02 span:first-child {
		font-size: 1.5rem;
		color: #fff;
		padding: 0 0 0 10.27vw;
		text-align: center;
		width: 21.33vw;
		box-sizing: border-box;
	}
	.prod2_o2 .c3HowtoTxt01 span:first-child {
		background: #0071da url("/-/Media/com/c3/top/190426/prod2_o2/ico_howto01.png") no-repeat 17px center;
		background-size: 25px auto;
	}
	.prod2_o2 .c3HowtoTxt02 span:first-child {
		background: #f18200 url("/-/Media/com/c3/top/190426/prod2_o2/ico_howto02.png") no-repeat 13px center;
		background-size: 33px auto;
	}
	.prod2_o2 .c3HowtoTxt01 span:last-child, .prod2_o2 .c3HowtoTxt02 span:last-child {
		font-size: 1.6rem;
		background: no-repeat left center;
		background-size: auto 100%;
		padding: 9px 4vw 9px 4.93vw;
	}
	.prod2_o2 .c3HowtoTxt01 span:last-child {
		color: #0071da;
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_howto_hr01.png");
	}
	.prod2_o2 .c3HowtoTxt02 span:last-child {
		color: #f18200;
		background-image: url("/-/Media/com/c3/top/190426/prod2_o2/bg_howto_hr02.png");
	}
	.prod2_o2 .c3HowtoBox02 {
		display: flex;
		justify-content: space-between;
		margin: 20px 0 0;
	}
	.prod2_o2 .c3HowtoBox02 ul {
		width: 68vw;
		margin: -0.4em 0 0;
	}
	.prod2_o2 .c3HowtoBox02 ul li {
		font-size: 1.4rem;
		line-height: 1.57;
		padding: 0 0 0 1.79em;
		margin: 10px 0 0;
		position: relative;
	}
	.prod2_o2 .c3HowtoBox02 ul li:first-child {
		margin-top: 0;
	}
	.prod2_o2 .c3HowtoBox02 ul li span {
		display: table;
		width: 20px;
		height: 20px;
		border-radius: 50%;
		background: #0071da;
		font-size: 1.2rem;
		font-weight: 700;
		color: #fff;
		position: absolute;
		left: 0;
	}
	.prod2_o2 .c3HowtoBox01 + .c3HowtoBox01 .c3HowtoBox02 ul li span {
		background: #f18200;
	}
	.prod2_o2 .c3HowtoBox02 ul li span span {
		display: table-cell;
		vertical-align: middle;
		text-align: center;
	}
	.prod2_o2 .c3HowtoBox02 div {
		width: 18.67vw;
	}
	/* c3CmnProduct
	-----------------------------------------------------------------*/
	.prod2_o2 #c3CmnProduct .c3CmnProductBox01 .c3CmnProductImg01 {
		padding: 0 6.67vw 0 0;
	}
	/* -------------------------------------------------------------------------------------------------------*/
}
/* -------------------------------------------------------------------------------------------------------------

	print

------------------------------------------------------------------------------------------------------------- */
@media print {
	/* -------------------------------------------------------------------------------------------------------*/
	/* -------------------------------------------------------------------------------------------------------*/
}
