@charset "utf-8";

/*-------------------------------------------------------------------------------
 ANY STYLES
 -------------------------------------------------------------------------------*/

/* INTRO */
.intro-heading {
	margin-top: 10px;
	font-size: 21px;
}
.intro-message {
	margin-top: 50px;
}
.intro-message-txt + .intro-message-txt {
	margin-top: 40px;
}
.intro-link-detail {
	margin-left: auto;
	margin-right: auto;
	margin-top: 95px;
	text-align: center;
	width: 980px;
}
.intro-link-detail li {
	display: block;
	float: left;
}
.intro-link-detail li + li {
	margin-left: 38px;
}

/* KEYVISUAL */
.keyvisual-wrap {
	height: 400px;
	margin-top: 30px;
}
.lte-ie8 .keyvisual-wrap {
	position: relative;
}
.keyvisual {
	height: 400px;
	left: 0;
	position: absolute;
	top: auto;
	width: 100%;
	z-index: 2;
	background: url("../img/kv_c3fit.jpg") no-repeat left center;
	-webkit-background-size: cover;
	background-size: cover;
	z-index: 1;
}
.keyvisual2 {
	height: 400px;
	left: 0;
	position: absolute;
	top: auto;
	width: 100%;
	z-index: 2;
	background: url("../img/kv_c3fit.jpg") no-repeat left center;
	-webkit-background-size: cover;
	background-size: cover;
	z-index: 2;
	display: none;
}
.keyvisual-wrap.scroll .keyvisual {
	height: inherit;
}
.lte-ie8 .keyvisual {
	background: url("../img/kv_c3fit_ie8.jpg") no-repeat;
}
.keyvisual-message {
	bottom: 50%;
	opacity: 0;
	position: absolute;
	-webkit-transform: translate(0, -50px);
	transform: translate(0, -50px);
	-webkit-transition: -webkit-transform 1s, opacity 1s;
	transition: transform 1s, opacity 1s;
	-webkit-transition-delay: 0.5s, 0.5s;
	transition-delay: 0.5s, 0.5s;

	font-size: 52px;
	width: 100%;
	text-align: center;
}
.keyvisual-message.onload {
	opacity: 1;
	-webkit-transform: -webkit-translate(0, -34px);
	transform: translate(0, -34px);
}
.keyvisual-link-buttons {
	opacity: 0;
	position: absolute;
	top: 50%;
	-webkit-transform: -webkit-translate(0, 50px);
	transform: translate(0 50px);
	-webkit-transition: -webkit-transform 1s, opacity 1s;
	transition: transform 1s, opacity 1s;
	-webkit-transition-delay: 1s, 1s;
	transition-delay: 0.5s, 0.5s;
	text-align: center;
	width: 100%;
}
.keyvisual-link-detail {
	display: inline-block;
}
.keyvisual-link-detail > li {
	float: left;
	width: 180px;
}
.keyvisual-link-detail > li + li {
	margin-left: 43px;
}
.keyvisual-link-buttons.onload {
	opacity: 1;
	-webkit-transform: -webkit-translate(0, 34px);
	transform: translate(0, 34px);
}
.lte-ie8 .keyvisual-message,
.lte-ie8 .keyvisual-link-buttons {
	display: none;
}

/* IMAGE-MENU */
.image-menu-wrap {
	z-index: 1000;
}
.image-menu {
	width: 100%;
}
.image-menu img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
.image-menu > li > a {
	display: block;
}
.image-menu > li > a:hover > img {
	opacity: 0.3;
	filter: alpha(opacity=30);
	-ms-filter: "alpha(opacity=30)";
}
.image-menu > li > a:hover > .btn-detail {
	background-color: #FFFFFF;
	color: #000000;
}
.image-menu li {
	position: relative;
	width: 50%;
	float: left;
}
.image-menu li img {
	width: 100%;
	-webkit-transition: opacity 0.5s;
	   -moz-transition: opacity 0.5s;
	    -ms-transition: opacity 0.5s;
	     -o-transition: opacity 0.5s;
	        transition: opacity 0.5s;
}
.image-menu .btn-detail {
	left: 50%;
	margin-left: -100px;
	margin-top: -25px;
	position: absolute;
	top: 50%;
	line-height: 50px;
	z-index: 2;
}
/* PROFILE */
.profile-container {
	width:980px;
	margin-top: 80px;
}
.profile-container > section + section {
	margin-top: 40px;
}
.profile-image img {
	width: 100%;
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
.profile-detail {
	overflow: hidden;
}
.profile-name {
	margin-top: 5px;
	font-size: 17px;
	line-height: 1.4;
}
.profile-name > span {
	display: block;
}
/* INDEX */
.index-wrap {
	width:980px;
	margin-top: 60px;
	overflow: hidden;
}
.index-inner > section {
	padding-top: 40px;
	border-top: 1px solid #323232;
}
.index-inner > section + section {
	margin-top: 40px;
}
.index-section-left {
	float: left;
}
.index-section-right {
	float: right;
}
.index-list {
	font-size: 15px;
	padding-top: 20px;
}
.index-list > li > a {
	color: #FFFFFF;
	cursor: pointer;
	-webkit-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all  0.5s ease;
}
.index-list > li > a:before {
	content: "・";
}
.index-list > li > a:hover {
	color: #CCCCCC;
}
.index-title {
	font-size: 21px;
	font-weight: 700;
	border-bottom: 1px solid #FFFFFF;
}
.index-detail-title {
	font-size: 17px;
	line-height: 1.2;
}
.profile-description {
	overflow: hidden;
}
.profile-detail-image > img {
	width: 100%;
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}

/* PRODUCT */
.product {
	padding-top: 140px;
}
.product-datail {
	margin-top: 70px;
}
.product-description-content {
	margin-top: 60px;
	width: 100%;
}
.product-price {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-size: 16px;
}
.product-description {
	font-size: 14px;
}
.product-logo-runtastic {
	float: right;
}
.product-logo-runtastic > span {
	display: block;
	text-align: right;
}
.product-image-wrap {
	background: url("../img/ecg2_c3fit.png") no-repeat left center;
	background-size: cover;
	height: 176px;
	padding: 62px 0;
	position: relative;
	text-align: right;
}
.product-image {
	margin-top: 14px;
}
.product-subtitle {
	position: relative;
	border-bottom: 1px solid #FFFFFF;
	min-height: 60px;
}
.product-logoline {
	display: inline-block;
	height: 50px;
	vertical-align: bottom;
	margin-right: 17px;
}
.product-logoline {
	display: inline-block;
	width: 340px;
	height: 50px;
	background: url("../img/logo_line_c3fit_in-pulse.svg") no-repeat;
	overflow: hidden;
	text-indent: -9999px;
	background-size: cover;
}
.lte-ie8 .product-logoline {
	width: 376px;
	height: 56px;
	background: url("../img/logo_line_c3fit_in-pulse.png") no-repeat;
}
.product-attention-wrap {
	padding-left: 10%;
}
.product-attention {
	float: left;
	margin-top: 40px;
}
.product-attention-url {
	margin-top: 30px;
}
.product-attention-url > a {
	display: block;
	color: #FFFFFF;
	text-decoration: underline;
}
.product-figure > img {
	width: 100%;
}
.product-price-content {
	width: 100%;
}
.product-price-content > li {
	float: left;
	width: 45%;
}
.product-price-content > li + li {
	margin-left: 10%;
}
.product-sammary {
	padding-left: 20px;
}
.product-sammary > dt,
.product-sammary > dd {
	font-size: 12px;
}
.product-sammary > dt {
	float: left;
}
.product-sammary > dt:after {
	content: ":";
	margin-left: 2px;
	margin-right: 10px;
}
.product-sammary > dd {
	overflow: hidden;
}
.product-title {
	font-size: 16px;
}
.product-price-name {
	font-size: 16px;
}
.product-price-details {
	position: relative;
}
.product-price-details > dt {
	font-size: 16px;
}
.product-price-details > dt:before {
	background-color: #FFFFFF;
	content: "";
	display: inline-block;
	height: 14px;
	margin-right: 5px;
	width: 14px;
}
.product-app {
	width: 100%;
	margin-top: 40px;
	padding-top: 80px;
	border-top: 1px solid #323232;
}
.product-app > * {
	float: left;
	width: 45%;
}
.product-sammary-container {
	margin-top: 5px;
}
.product-price-list .product-price {
	font-size: 48px;
	padding: 0 15px;
}
.product-price-container {
	position: absolute;
	top: -40px;
	right: 10px;
	font-size: 16px;
}
.product-price-list-container {
	margin-top: 30px;
	padding-left: 10px;
	padding-right: 10px;
}
.product-price-list-container > li + li {
	margin-top: 25px;
}
.product-notice-container {
	position: absolute;
	right: 0;
	bottom: 10px;
	display: block;
	width: 80px;
	height: 80px;
	background-color: #FFFFFF;
	border-radius: 45px;
	color: #231F20;
	font-size: 10px;
	text-align: center;
}
.product-notice {
	display: inline-block;
	padding: 14px 12px;
}
.product-notice span {
	display: block;
}
.section-shop-list {
	margin-left: -80px;
}
.section-shop-list > li {
	float: left;
	width: 50%;
	padding-left: 80px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.deployment-store {
	width: 100%;
	overflow: hidden;
	margin-top: 40px;
}
.deployment-store-heading {
	font-size: 16px;
}
.deployment-store-details > a {
	padding: 10px 20px;
}
.deployment-store-details > a:hover {
	background-color: #323232;
}
.deployment-store-details > a,
.deployment-store-details > a:link {
	display: block;
	color: #FFFFFF;
}
.deployment-store .store-name {
	margin-top: 7px;
	padding-left: 40px;
	position: relative;
	font-size: 24px;
	line-height: 1.2;
}
.store-name:before {
	position: absolute;
	left: 0;
	top: 8px;
	content: "";
	width: 20px;
	height: 36px;
	background: url("../img/icon-arrow.svg") no-repeat;
}
.lte-ie8 .store-name:before {
	background: url("../img/icon-arrow.png") no-repeat;
}
.store-name-main {
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
}
.deployment-store .store-name .tenpo {
	display: block;
	font-size: 16px;
}
.deployment-store .store-address {
	font-size: 14px;
	margin-top: 20px;
}
.deployment-store .store-tel {
	display: block;
}

/* What’s Heart Rate */
.interview {
padding-top: 140px;
	width:980px;
}
.interview-note {
	margin-top: 20px;
}

/* Use a Heart Rate */
.heart-rate {
	margin-top: 160px;
}
.heart-rate-content {
	margin-top: 40px;
	width: 980px;
}
.heart-rate-message {
	width: 40%;
	padding-right: 30px;
	float: left;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.heart-rate-detail {
	width: 60%;
	float: left;
}
.heart-rate-heading {
	font-size: 16px;
}
.heart-standard-content {
	width:980px;
	margin-top: 50px;
	overflow: hidden;
}
.heart-standard-heading {
	font-size: 17px;
}
.exercise-intensity {
	display: table;
	width: 100%;
	margin-top: 40px;
}
.fractional-expression span {
	display: block;
}
.fractional-expression {
	font-size: 16px;
	width: 360px;
}
.equal {
	font-size: 36px;
}
.fractional-expression,
.equal,
.answer {
	display: table-cell;
	vertical-align: middle;
}
.equal {
	padding-left: 25px;
	vertical-align: bottom;
	padding-bottom: 90px;
}
.denominator {
	border-top: 1px solid #A7A8A9;
	margin-top: 20px;
	padding-top: 10px;
}
.answer-content {
	margin-top: 20px;
	margin-left: -1px;
}
.alert-text {
	height: 40px;
	color: #FF0000;
	font-size: 16px;
}
.answer {
	display: table-cell;
	padding: 0 15px;
}
.answer~.answer {
	border-left: 1px solid #333333;
}
.answer-standard {
	float: left;
	width: 20%;
	padding: 0 15px 150px;
	border-left: 1px solid #323232;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
.answer-standard.active {
	background-color: #323232;
}
.answer-box {
	border: 1px solid #FFFFFF;
	border-radius: 3px;
	color: #FFFFFF;
	padding: 10px;
	height: 165px;
	display: table-cell;
	min-width: 175px;
}
.answer-title {
	color: #FFFFFF;
	font-size: 22px;
	display: block;
	padding-top: 15px;
	line-height: 1;
}
.answer-value-wrap {
	text-align: right;
	margin-top: 30px;
}
.answer-value {
	font-size: 70px;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	line-height: 1.2;
}
.answer-standard-value {
	padding: 10px 10px 0;
	font-size: 56px;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	line-height: 1.2;
}
.answer-standard-value > * {
	vertical-align: middle;
}
.answer-standard-percent {
	font-size: 36px;
	font-weight: 300;
}
.answer-standard-number {
	font-size: 60px;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
}
.answer-standard-kara {
	font-size: 26px;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	margin-right: 5px;
	margin-left: 5px;
}
.answer-percent {
	font-size: 45px;
	font-weight: 300;
}
.answer-subtitle {
	font-size: 16px;
}
.answer-visual {
}
.answer-message {
	margin-top: 35px;
}
.icon-answer {
	background-position: center bottom;
	background-repeat: no-repeat;
}
.answer54 { background-image: url("../img/answer_icon_54.png"); }
.answer64 { background-image: url("../img/answer_icon_64.png"); }
.answer74 { background-image: url("../img/answer_icon_74.png"); }
.answer84 { background-image: url("../img/answer_icon_84.png"); }
.answer94 { background-image: url("../img/answer_icon_94.png"); }
.lte-ie8 .answer54 { background-image: url("../img/answer_icon_54.png"); }
.lte-ie8 .answer64 { background-image: url("../img/answer_icon_64.png"); }
.lte-ie8 .answer74 { background-image: url("../img/answer_icon_74.png"); }
.lte-ie8 .answer84 { background-image: url("../img/answer_icon_84.png"); }
.lte-ie8 .answer94 { background-image: url("../img/answer_icon_94.png"); }

.input-area {
	display: table-cell;
	vertical-align: bottom;
	font-size: 14px;
}
.input-area input:focus {
	background-color: #666666;
	background-color: rgba(255,255,255,0.2);
	color: #FFFFFF;
}
.input-area.minus {
	font-size: 18px;
	padding-left: 20px;
	line-height: 45px;
}
.input-area.minus + .input-area {
	padding-left: 20px;
}
.denominator .input-area {
	padding-top: 10px;
}
.input-area input {
	border: none;
	width: 240px;
	height: 40px;
	border-radius: 3px;
	margin-top: 10px;
}
.exercise-intensity input {
	border: none;
	width: 120px;
	height: 40px;
	border-radius: 3px;
	padding: 10px;
	margin-top: 10px;
	color: #000000;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	font-size: 20px;
	line-height: 1;
}
.karvonen-formula {
	text-align: left;
	margin-top: 10px;
}
.input-invalid{
	background-color: #FFDDDD;
}

/* FOOTER */
.footer{width:980px; margin:0 auto;}
.footer p{text-align:center; font-size:10px;}
.mgb20{margin-bottom:20px;}

/* INDEX */
.indxImg,
.c3nav{ width:680px; margin:0 auto;}
ul.c3nav li{float:left; display:inline;}


/* PRODUCT */
.prdctImg{ margin:70px 0 60px 0;}
.itemWrap{
	width:980px;
	padding:0px;
	margin:0 auto;
}
.itemWrap ul{margin-bottom:30px;}
.itemWrap ul li{
	font-size:11.5px;
	width:179px;
	min-height:309px;
	background:#FFFFFF;
	margin-right:8px;
	float:left;
	display:inline;
	padding:5px;
}
.itemWrap ul li p{ color:#666666; line-height:1.4em; margin-bottom:5px;}
li.mgr0{margin-right:0px !important;}
.itemWrap ul li p.price{font-weight:bold; font-size:14px; margin-bottom:15px;}
.itemWrap ul li div.buybtn{ margin-left:0px;}
.itemWrap ul li a:hover img,
ul.c3nav li a:hover img{
opacity: .5;
-webkit-opacity: .5;
-moz-opacity: .5;
filter: alpha(opacity=50);	/* IE lt 8 */
-ms-filter: "alpha(opacity=50)"; /* IE 8 */
}
 
.itemWrap ul li a img,
ul.c3nav li a img{
-webkit-transition: opacity 0.5s ease-out;
-moz-transition: opacity 0.5s ease-out;
-ms-transition: opacity 0.5s ease-out;
transition: opacity 0.5s ease-out;
}
p.pagetop{text-align:right; margin-top:-20px;}

/* CAUTION */
.article{ margin:40px 20px;}
dl.att dt,
dl.att dd{ margin-bottom:10px;}
	
dl.att dt{
	font-size:1.2em;}
dl.att dd{
    padding-left: 1em;}
p.indent{
	text-indent:1em;}

/* FAQ */
.GuideBoxList{ margin:20px auto; }
.GuideBoxList h3{ font-size:18px; font-weight:bold; margin-bottom:15px; padding-bottom:8px; border-bottom:1px solid #fff; }
.GuideBoxList a{ color:#FFFFFF; }
.GuideBoxList a:hover{ text-decoration:underline; }
.GuideBoxList .Left{ float:left; display:inline; width:470px; margin:0 40px 0 0; }
.GuideBoxList .Right{ float:left; display:inline; width:470px; margin:0; }
.GuideBoxList .faqBox{ margin-bottom:50px; }
.GuideBoxList .faqBox a{ padding-left:0.5em; }
.GuideAnserBoxList h3{ font-size:23px; font-weight:bold; margin-bottom:30px; padding-bottom:8px; border-bottom:3px dotted #fff; }
.GuideAnserBoxList .AnserBox{ margin-bottom:50px; }
.GuideAnserBoxList .AnserBox p{ font-size:14px;  margin-bottom:15px; }
.GuideAnserBoxList .AnserBox .icon_q{ background:url(../img/icon_q.gif) no-repeat left center; padding:0 0 0 30px; }
.GuideAnserBoxList .AnserBox .icon_a{ background:url(../img/icon_a.gif) no-repeat left 2px; padding:0 0 0 30px; }
.GuideAnserBoxList .AnserBox a{ text-decoration:underline; }
