@charset 'UTF-8';

/* ------------------------------
 トップページ
------------------------------ */

/* 既存上書き */

.btn_closing a {
	height: 55px;
	padding-top: 25px;
}

/* メイン */

#main {
	background: url(/img/pos/main_bg.jpg) no-repeat center top;
}

#main_inner {
	position: relative;
	width: 996px;
	height: 638px;
}

.main_txt_1,
.main_txt_2 {
	position: absolute;
}

.main_txt_1 {
	top: 47px;
	left: 0;
}

.main_txt_2 {
	top: 315px;
	left: 427px;
}

/* 中見出し */

.t_pos {
	color: #4b4b4b;
	font-weight: bold;
	font-size: 38px;
	line-height: 42px;
	text-align: center;
}

.t_pos span {
	display: block;
	margin-bottom: 10px;
	color: #141517;
	font-weight: normal;
	font-size: 18px;
	line-height: 23px;
}

.txt_pos {
	color: #4b4b4b;
	font-size: 14px;
	line-height: 24px;
}

.w650 {
	width: 650px;
	margin-right: auto;
	margin-left: auto;
}

/* POSレジとは？ */

#what {
	padding: 60px 0 80px;
	background-color: #f6f6f6;
}

#whats {
	width: 848px;
}

#whats li {
	float: left;
	width: 200px;
	padding-top: 160px;
	text-align: center;
	background-repeat: no-repeat;
	background-position: center top;
}

#whats li:not(:last-child) {
	margin-right: 16px;
}

#whats li:nth-child(1) {
	background-image: url(/img/pos/i_what_1.png);
}

#whats li:nth-child(2) {
	background-image: url(/img/pos/i_what_2.png);
}

#whats li:nth-child(3) {
	background-image: url(/img/pos/i_what_3.png);
}

#whats li:nth-child(4) {
	background-image: url(/img/pos/i_what_4.png);
}

#whats li dt {
	margin-bottom: 10px;
	color: #4b4b4b;
	font-weight: bold;
	font-size: 17px;
	line-height: 27px;
}

#whats li dt::after {
	display: block;
	width: 36px;
	height: 1px;
	margin: 5px auto;
	background-color: #ccc;
	content: '';
}

#whats li dd {
	color: #4c4948;
	font-size: 13px;
	line-height: 17px;
}

/* 使いやすさ */

#easy {
	position: relative;
	top: -90px;
	padding: 60px 0 40px;
}

/* 動画 */

#movie_wrapper {
	width: 674px;
	height: 384px;
	margin: 0 auto;
}

/* 使える機能 */

#func {
	padding: 40px 0 73px;
}

#func_pos,
#func_admin {
	padding: 75px 0 60px;
}

#func_pos {
	background-color: #f8eadc;
	border-top: 2px solid #ef9738;
}

#func_admin {
	background-color: #def6ee;
	border-top: 2px solid #2c939c;
}

#func_pos h3,
#func_admin h3 {
	position: relative;
	top: -98px;
	margin-bottom: -38px;
}

#func_pos .funcs {
	width: 918px;
}

#func_pos .funcs li {
	float: left;
	width: 282px;
}

#func_pos .funcs li:not(:last-child) {
	margin-right: 36px;
}

#func_admin .funcs {
	width: 952px;
}

#func_admin .funcs li {
	float: left;
	width: 308px;
}

#func_admin .funcs li h4,
#func_admin .funcs li p {
	padding-left: 26px;
}

#func_admin .funcs li:not(:last-child) {
	margin-right: 14px;
}

.funcs li h4 {
	margin: 10px 0 5px;
	font-weight: bold;
	font-size: 20px;
	line-height: 30px;
}

#func_pos .funcs li h4 {
	color: #e07c10;
}

#func_admin .funcs li h4 {
	color: #2c939c;
}

.funcs li p {
	color: #2a2a2a;
	font-size: 13px;
	line-height: 20px;
}

.funcs_sub {
	width: 880px;
	margin-top: 30px;
	padding: 25px 40px;
	background-color: #fff;
	border-radius: 5px;
}

.funcs_sub dl,
.funcs_sub dd ul {
	float: left;
}

.funcs_sub dl:not(:last-child) {
	margin-right: 50px;
	padding-right: 60px;
	border-right: 1px solid #d7d7d7;
}

.funcs_sub dt {
	display: inline-block;
	margin-bottom: 10px;
	padding: 2px 10px;
	color: #333535;
	font-weight: bold;
	font-size: 15px;
	line-height: 20px;
	background-color: #fdfad6;
}

.funcs_sub dd {
	overflow-y: hidden;
}

.funcs_sub dd ul:not(:last-child) {
	margin-right: 50px;
}

.funcs_sub dd ul li {
	color: #070102;
	font-size: 13px;
	line-height: 20px;
}

/* こんな不安 */

#trouble {
	padding: 70px 0 100px;
}

#trouble h2 {
	display: inline-block;
	min-height: 95px;
	color: #3e3a39;
	background: url(/img/pos/bg_t_trouble.png) no-repeat right top;
}

#trouble h2 span {
	display: inline-block;
	font-weight: bold;
	border-bottom: 1px solid #000;
}

#troubles {
	width: 808px;
}

#troubles li {
	padding: 30px 0;
	overflow: hidden;
	border-bottom: 1px solid #ebebeb;
}

.txt_troubles {
	float: left;
	width: 208px;
	text-align: center;
}

.troubles_inner {
	float: right;
	width: 570px;
}

.troubles_inner h3 {
	display: inline-block;
	margin-bottom: 10px;
	color: #466676;
	font-weight: bold;
	font-size: 28px;
	line-height: 40px;
	background: -webkit-linear-gradient(transparent 60%, #fbf9b2 60%);
	background: linear-gradient(transparent 60%, #fbf9b2 60%);
}

.troubles_inner p {
	color: #494949;
	font-size: 16px;
	line-height: 22px;
}

/* ご購入は今がおトク！ */

#reverse {
	width: 812px;
	padding: 45px 60px 45px 85px;
	background-color: #fff;
	border: 3px solid #ec684d;
}

#reverse_inner {
	float: left;
	width: 424px;
}

#i_reverse {
	float: right;
	width: 348px;
	padding-top: 13px;
}

#reverse_inner p {
	margin-top: 20px;
	color: #3e3e3e;
	font-size: 16px;
	line-height: 26px;
}

/* 導入費用 */

#price {
	padding-bottom: 128px;
	background-color: #f5f5f5;
}

#price h2 {
	margin-bottom: 34px;
	padding: 27px 0 19px;
	background-color: #e36230;
}

.price {
	width: 900px;
	margin-right: auto;
	margin-left: auto;
	padding: 30px;
	border: 1px solid #dbdbdb;
	border-radius: 5px;
}

.price:not(:last-child) {
	margin-bottom: 30px;
}

.price:nth-of-type(1) {
	min-height: 418px;
	background: #fff url(/img/pos/bg_price_1.jpg?v=1) no-repeat right top;
}

.price:nth-of-type(2) {
	min-height: 306px;
	background: #fff url(/img/pos/bg_price_2.jpg?v=1) no-repeat right top;
}

.price p {
	width: 600px;
	color: #333;
	font-size: 14px;
	line-height: 24px;
}

/* よくあるご質問 */

#qa h2 span {
	display: inline-block;
	color: #3e3a39;
	font-weight: bold;
	border-bottom: 1px solid #000;
}

.qa dt {
	margin-top: 26px;
	padding: 28px 73px 28px 60px;
	font-weight: bold;
	font-size: 24px;
	line-height: 28px;
	background: url(/img/top/tg_qa_off.png) no-repeat 892px center, #f7f7f7 url(/img/top/ico_q.png) no-repeat 20px center;
	border-radius: 5px;
	box-shadow: 0 0 13px 0 rgba(0, 0, 0, 0.3);
	cursor: pointer;
}

.qa dt.on {
	background: url(/img/top/tg_qa_on.png) no-repeat 892px center, #f7f7f7 url(/img/top/ico_q.png) no-repeat 20px center;
}

.qa dt span {
	color: #bf0000;
}

.qa dd {
	margin-top: 17px;
	padding: 20px;
	font-size: 18px;
	line-height: 28px;
	background-color: #fff8ee;
	border-radius: 5px;
}

/* スピード導入対応！ */

#speeds {
	width: 890px;
}

#speeds li {
	float: left;
	width: 200px;
}

#speeds li:not(:last-child) {
	margin-right: 30px;
}

#speeds li div {
	position: relative;
	left: 34px;
}

#speeds li dt {
	margin: 20px 0 10px;
	color: #e0a60b;
	font-weight: bold;
	font-size: 23px;
	line-height: 30px;
	text-align: center;
}

#speeds li dt::after {
	display: block;
	width: 36px;
	height: 1px;
	margin: 5px auto;
	background-color: #ccc;
	content: '';
}

#speeds li dd {
	padding: 0 15px;
	color: #151006;
	font-size: 13px;
	line-height: 17px;
}

/*
--------------------------------------------------------------------------------
 END OF CSS
--------------------------------------------------------------------------------
*/
