@charset "utf-8";

/*=====================================================
 * Style URL: /common/css/screen.css
 * Version: 1.0
 * Last Up Date: 2020/06/xx
 *
 * Markup Reference:
 *
=====================================================*/



/*----- contents -------

	1: Main Interface setting
		: container
		: header
		: footer
		: wrapper
		: main_contents
		: sub_contents
	2: Module
	3: Common
	4: clearfix

----------------------*/



/*
===== 1: Main Interface setting ===========================*/

html,body {
	height: 100%;
}

body.fixed {
	position: fixed;
	width: 100%;
}

/* header
--------------------*/
header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 130px;
	background: #ffffff;
	z-index: 3000;
}

header.fixed_sp {
	position: fixed;
	top: -70px !important;
	border-bottom: 1px solid #E6E6E6;
}

.index header,
.index header.fixed_sp {
	position: fixed;
	top: 0 !important;
	background: transparent !important;
	border-bottom: none !important;
}

.index header .logo_terumo + .sec_inner {
	position: fixed !important;
	top: -100px;
	width: 100%;
	background: #ffffff;
	border-bottom: 1px solid #E6E6E6;
}

.index header.open .sec_inner {
	top: 0 !important;
}

header .logo_terumo {
	padding: 0 5.333%;
	border-bottom: 2px solid #00885F;
	font-size: 0;
	line-height: 68px;
}

.index header .logo_terumo {
	visibility: hidden;
}

.index #wrapper .logo_terumo {
	position: relative;
	z-index: 3000;
}

header .logo_terumo img {
	width: 105px;
	vertical-align: middle;
}

header .sec_inner {
	position: relative;
	width: auto;
	height: 60px;
}

header .sec_inner .logo {
	position: absolute;
	top: 12px;
	left: 5.333%;
	font-size: 0;
	line-height: 0;
}

header .sec_inner .logo img {
	width: 114px;
}

header .nav_menu {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2000;
}

header .nav_menu a {
	display: block;
	width: 60px;
	height: 60px;
}

header.open {
	top: -70px !important;
}

header.open .nav_menu a {
	background: url(/common/img/hdr_nav_close.png) no-repeat 50% 50%;
	background-size: 60px 60px;
}

header.open .nav_menu a img {
	visibility: hidden;
}

header .sec_menu {
	position: absolute;
	top: 59px;
	left: 0;
	width: 100%;
	z-index: 1000;
}

header.open .sec_menu {
	background: #29BC8F;
}

header .sec_menu_inner {
	width: 100%;
	height: 0;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}

header.open .sec_menu_inner {
	overflow-y: scroll;
}

header .gnav {
	padding: 30px 5.333% 0;
}

header .gnav > ul > li {
	position: relative;
	margin: 10px 0 0;
	background: #ffffff;
	border-radius: 5px;
}

header .gnav > ul > li i {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 70px;
	background: transparent;
	z-index: 2;
}

header .gnav > ul > li > a {
	display: block;
	position: relative;
	padding: 0 8.955%;
}

header .gnav > ul > li > a > span {
	display: block;
	padding: 27px 20px 27px 60px;
	background: url(/common/img/icon_plus_01.png) no-repeat 100% 50%;
	background-size: 15px auto !important;
	line-height: 1;
	white-space: nowrap;
}

header .gnav > ul > li > a > span.open {
	background: url(/common/img/icon_minus_01.png) no-repeat 100% 50%;
}

header .gnav > ul > li > a > span br {
	display: none;
}

header .gnav > ul > li > a img {
	position: absolute;
	top: 50%;
	left: 8.955%;
	transform: translateY(-50%);
}

header .gnav > ul > li:nth-child(1) a img { width: 37px; margin-left: 2px; }
header .gnav > ul > li:nth-child(2) a img { width: 39px; margin-left: 0px; }
header .gnav > ul > li:nth-child(3) a img { width: 36px; margin-left: 2px; }
header .gnav > ul > li:nth-child(4) a img { width: 39px; margin-left: 0px; }
header .gnav > ul > li:nth-child(5) a img { width: 27px; margin-left: 5px; }

header .gnav > ul > li div {
	display: none;
	padding: 0 5.970% 5.970%;
}

header .gnav > ul > li ul.child {
	padding: 0 5.970%;
	border-radius: 5px;
	opacity: 1 !important;
}

header .gnav > ul > li ul.child li {
	border-top: 1px solid;
	border-color: rgba(0,0,0,0.1);
}

header .gnav > ul > li ul.child li:first-child {
	border-top: none;
}

header .gnav > ul > li ul.child li a {
	display: block;
	font-size: 14px;
	line-height: 1.5;
}

header .gnav > ul > li ul.child li span {
	display: block;
	padding: 16px 25px 16px 0;
	background-size: 18px 18px !important;
}

header .gnav > ul > li.gnav_relationship ul.child { background: #FCEDF4; }
header .gnav > ul > li.gnav_health ul.child { background: #FDE9E3; }
header .gnav > ul > li.gnav_fever ul.child { background: #FFECC7; }
header .gnav > ul > li.gnav_basics ul.child { background: #E0F3F6; }
header .gnav > ul > li.gnav_activity ul.child { background: #E6EFF9; }

header .gnav > ul > li.gnav_relationship ul.child li a span { background: url(/common/img/arrow_01.png) no-repeat 100% 50%; }
header .gnav > ul > li.gnav_health ul.child li a span { background: url(/common/img/arrow_02.png) no-repeat 100% 50%; }
header .gnav > ul > li.gnav_fever ul.child li a span { background: url(/common/img/arrow_03.png) no-repeat 100% 50%; }
header .gnav > ul > li.gnav_basics ul.child li a span { background: url(/common/img/arrow_04.png) no-repeat 100% 50%; }
header .gnav > ul > li.gnav_activity ul.child li a span { background: url(/common/img/arrow_05.png) no-repeat 100% 50%; }

header .sec_search {
	display: block !important;
	height: 50px;
	padding: 20px 5.333% 40px;
	opacity: 1 !important;
}

header .sec_search .search {
	display: block !important;
	position: relative;
	height: 46px;
	padding: 0 0 0 4.333%;
	background: #ffffff url(/common/img/icon_search_04.png) no-repeat 100% 50%;
	background-size: auto 50px;
	border: 2px solid #ffffff;
	border-radius: 5px;
	opacity: 1 !important;
	overflow: hidden;
}

header .sec_search .search input.text_field {
	width: 70%;
	margin: 9px 0 0;
	padding: 0;
	background: none;
	border: none;
	font-size: 14px;
	text-align: center;
	vertical-align: middle;
	outline: none;
}

header .sec_search .search input.search_btn {
	position: absolute;
	top: -1px;
	right: -1px;
	width: 80px;
	height: 50px;
	opacity: 0;
}

header footer {
	margin: 0;
}

header footer .sec_inner {
	height: auto;
}

header footer .sec_03 {
	padding-bottom: 100px;
}


/* footer
--------------------*/
footer {
	margin: 45px 0 0;
	background: #29BC8F;
}

/* .sec_01 */
footer .sec_01 {
	padding: 40px 5.333%;
}

footer .sec_01 nav ul li {
	display: table;
	float: left;
	width: 48.6%;
	margin: 2.77% 0 0;
}

footer .sec_01 nav ul li:nth-child(even) {
	float: right;
}

footer .sec_01 nav ul li:nth-child(1),
footer .sec_01 nav ul li:nth-child(2) {
	margin-top: 0;
}

footer .sec_01 nav ul li a {
	display: table-cell;
	position: relative;
	width: 100%;
	height: 80px;
	background: #ffffff;
	border-radius: 5px;
	line-height: 1.4;
	text-align: center;
	vertical-align: middle;
}

footer .sec_01 nav ul li a span {
	display: inline-block;
	font-size: 14px;
	text-align: left;
	vertical-align: middle;
}

footer .sec_01 nav ul li a img {
	margin: 0 10px 0 0;
	vertical-align: middle;
}

footer .sec_01 nav ul li:nth-child(1) a img { width: 37px; }
footer .sec_01 nav ul li:nth-child(2) a img { width: 39px; }
footer .sec_01 nav ul li:nth-child(3) a img { width: 36px; }
footer .sec_01 nav ul li:nth-child(4) a img { width: 39px; }
footer .sec_01 nav ul li:nth-child(5) a img { width: 27px; }

footer .sec_01 .sec_search {
	height: 50px;
	padding: 20px 0 0;
}

footer .sec_01 .sec_search .search {
	position: relative;
	height: 46px;
	padding: 0 0 0 4.333%;
	background: #ffffff url(/common/img/icon_search_04.png) no-repeat 100% 50%;
	background-size: auto 50px;
	border: 2px solid #ffffff;
	border-radius: 5px;
	overflow: hidden;
}

footer .sec_01 .sec_search .search input.text_field {
	width: 70%;
	margin: 9px 0 0;
	padding: 0;
	background: none;
	border: none;
	font-size: 14px;
	text-align: center;
	vertical-align: middle;
	outline: none;
}

footer .sec_01 .sec_search .search input.search_btn {
	position: absolute;
	top: -1px;
	right: -1px;
	width: 80px;
	height: 50px;
	opacity: 0;
}

/* .sec_02 */
footer .sec_02 {
	padding: 30px 5.333% 40px;
	background-color: rgba(0,0,0,0.05);
}

footer .sec_02 .sec_nav_01 li {
	display: table;
	width: 100%;
	margin: 10px 0 0;
}

footer .sec_02 .sec_nav_01 li a {
	display: table-cell;
	position: relative;
	height: 80px;
	background: #ffffff;
	border-radius: 5px;
	color: #29BC8F;
	line-height: 1.4;
	text-align: center;
	vertical-align: middle;
}

footer .sec_02 .sec_nav_01 li a span {
	display: inline-block;
	padding: 0 0 0 20px;
	letter-spacing: 0.1em;
	text-align: left;
}

footer .sec_02 .sec_nav_01 li.nav_about a img {
	width: 39px;
}

footer .sec_02 .sec_nav_01 li.nav_download a img {
	width: 37.5px;
}

footer .sec_02 .sec_nav_01 li.nav_download a i {
	display: block;
	padding: 4px 0 2px;
	font-size: 11px;
	font-weight: bold;
	letter-spacing: 0.05em;
}

footer .sec_02 .sec_nav_01 li.nav_quiz a img {
	width: 157px;
}

footer .sec_02 .sec_nav_01 li a img.blank {
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 12px !important;
}

footer .sec_02 .sec_tag_list_02 {
	padding: 30px 0 0;
	font-size: 0;
	line-height: 0;
	text-align: center;
}

footer .sec_02 .sec_tag_list_02 li {
	display: inline-block;
	margin: 10px 5px 0;
}

footer .sec_02 .sec_tag_list_02 li a {
	display: inline-block;
	padding: 0 20px 2px;
	background: #ffffff;
	border-radius: 3px;
	font-size: 16px;
	line-height: 48px;
}

footer .sec_02 .sec_tag_list_02 + .nav_all {
	margin: 20px 0 0;
	text-align: center;
}

footer .sec_02 .sec_tag_list_02 + .nav_all a {
	display: inline-block;
	padding: 0 40px 1px 0;
	background: url(/common/img/arrow_07.png) no-repeat 100% 50%;
	background-size: 30px 30px;
	color: #ffffff;
	font-size: 16px;
	line-height: 29px;
}

footer .sec_02 .sec_nav_02 {
	padding: 30px 0 0;
}

footer .sec_02 .sec_nav_02 ul li {
	display: table;
	width: 100%;
	margin: 10px 0 0;
}

footer .sec_02 .sec_nav_02 ul li a {
	display: table-cell;
	position: relative;
	width: 100%;
	height: 80px;
	background: #ffffff;
	border-radius: 5px;
	line-height: 1.4;
	text-align: center;
	vertical-align: middle;
}

footer .sec_02 .sec_nav_02 li:first-child a img {
	width: 230px;
}

footer .sec_02 .sec_nav_02 li a img.blank {
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 12px !important;
}

footer .sec_02 .sec_nav_02 li img {
	vertical-align: middle;
}

footer .sec_02 .sec_nav_02 li:nth-child(2) img {
	width: 220px;
	margin-top: 7px;
}


footer .sec_02 .sec_nav_02 li:nth-child(3) span {
	display: inline-block;
	padding: 0 0 0 18px;
	vertical-align: middle;
}

footer .sec_02 .sec_nav_02 li:nth-child(3) img {
	width: 135px;
}

footer .sec_02 .sec_share {
	margin: 45px 0 0;
	text-align: center;
	font-size: 0;
	line-height: 0;
}

footer .sec_02 .sec_share li {
	display: inline-block;
	margin: 0 10px;
}

footer .sec_02 .sec_share li a {
	display: table-cell;
	height: 30px;
	vertical-align: middle;
}

footer .sec_02 .sec_share li:nth-child(1) img { width: auto; height: 28px; }
footer .sec_02 .sec_share li:nth-child(2) img { width: auto; height: 30px; }
footer .sec_02 .sec_share li:nth-child(3) img { width: auto; height: 30px; }

/* .sec_03 */
footer .sec_03 {
	padding: 40px 5.333% 37px;
	background: #ffffff;
}

footer .sec_03 nav {
	margin: 40px 0 0;
	padding: 15px 0 0;
	border-top: 1px solid #E6E6E6;
	line-height: 13px;
	text-align: center;
}

footer .sec_03 nav ul {
	display: inline;
}

footer .sec_03 nav li {
	display: inline-block;
	margin: 25px 6px 0;
}

footer .sec_03 nav li a {
	display: inline-block;
	font-size: 13px;
	letter-spacing: 0.05em;
	white-space: nowrap;
}

footer .sec_03 nav li a.blank {
	padding: 0 22px 0 0;
	background: url(/common/img/bullet_blank_02.png) no-repeat 100% 1px;
	background-size: 12px 12px;
}

footer .sec_03 .sec_share {
	text-align: center;
	font-size: 0;
	line-height: 0;
}

footer .sec_03 .sec_share_02 {
	margin-top: 30px;
}

footer .sec_03 .sec_share dt {
	display: inline-block;
	padding: 0 12px 0 0;
	font-size: 16px;
	line-height: 1;
	vertical-align: 9px;
}

footer .sec_03 .sec_share_01 dt {
	display: block;
	padding: 0 0 20px;
}

footer .sec_03 .sec_share dd {
	display: inline-block;
	margin: 0 12px;
}

footer .sec_03 .sec_share dd a {
	display: table-cell;
	height: 28px;
	vertical-align: middle;
}

footer .sec_03 .sec_share_01 dd a img { width: auto; height: 30px; }
footer .sec_03 .sec_share_01 dd + dd a img { width: auto; height: 28px; }
footer .sec_03 .sec_share_01 dd + dd + dd a img { width: auto; height: 30px; }

footer .sec_03 .sec_share_02 dd a img { width: auto; height: 28px; }
footer .sec_03 .sec_share_02 dd + dd a img { width: auto; height: 24px; }

footer .sec_03 .copyright {
	margin: 30px 0 0;
	font-size: 10px;
	line-height: 1.5;
	letter-spacing: 0.1em;
	text-align: center;

}

/* .pagetop */
footer .pagetop {
	position: fixed;
	right: 18px;
	bottom: 30px;
	opacity: 0;
	z-index: 10;
}

footer .pagetop img {
	width: 15px;
}


/* container
--------------------*/
#container {
	position: relative;
	overflow: hidden;
}

#container .sec_inner {
	position: relative;
}

/* contents
--------------------*/
#contents {}


/* wrapper
--------------------*/
#wrapper {
	padding: 130px 0 0;
}

.index #wrapper {
	padding: 0;
}

/* main_contents
--------------------*/
#main_contents {}


/* sub_contents
--------------------*/
#sub_contents {}


/*
===== 2: Module ===========================*/

/* sec_item
--------------------*/
.sec_item .thumb img {
	border-radius: 5px;
	overflow: hidden;
}

.sec_item .sec_tag_list_01 {
	height: 26px;
	font-size: 0;
	line-height: 0;
	overflow: hidden;
}

.sec_item .sec_tag_list_01 li {
	display: inline-block;
}

.sec_item .sec_tag_list_01 li a {
	display: inline-block;
	margin: 0 6px 0 0;
	padding: 0 10px 1px;
	background: #ffffff;
	border: 1px solid #29BC8F;
	border-radius: 3px;
	font-size: 10px;
	line-height: 23px;
}

/* sec_recommend
--------------------*/
.sec_recommend {
	margin: 40px 5.333% 0;
}

.sec_recommend h3 {
	color: #29BC8F;
	font-size: 30px;
	font-weight: 400;
	text-align: center;
	line-height: 1;
	letter-spacing: 0.1em;
}

.sec_recommend .ms {
	margin: 30px 0 0;
}

.sec_recommend .ms .ls,
.sec_recommend .ms .rs {
	float: none !important;
}

.sec_recommend .ms dd p {
	margin: 10px 0 15px;
	line-height: 1.6;
}

.sec_recommend .ms .rs .sec_item {
	margin: 20px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid #e6e6e6;
}

.sec_recommend .ms .rs .sec_item dl {
	display: table;
	width: 100%;
}

.sec_recommend .ms .rs .sec_item + .sec_item {
	margin: 20px 0 0;
}

.sec_recommend .ms .rs .sec_item dt {
	display: table-cell;
	width: 100px;
	vertical-align: top;
}

.sec_recommend .ms .rs dd {
	display: table-cell;
	padding: 0 0 0 20px;
	vertical-align: top;
}

.sec_recommend .ms .rs dd p {
	margin: -4px 0 0;
}

.sec_recommend .ms .rs .sec_tag_list_01 {
	margin: 12px 0 0;
}


/* bread_crumbs
--------------------*/
.bread_crumbs {
	padding: 20px 0;
	background: #F8F8F8;
	font-size: 10px;
	line-height: 1;
	white-space: nowrap;
	overflow: hidden;
	overflow-x: scroll;
	-webkit-overflow-scrolling: touch;
}

.relationship .bread_crumbs { background: #FCEDF4; }
.health .bread_crumbs { background: #FDE9E3; }
.fever .bread_crumbs { background: #FFECC7; }
.basics .bread_crumbs { background: #E0F3F6; }
.activity .bread_crumbs { background: #E6EFF9; }

.bread_crumbs div {
	padding: 0 5.333%;
}

.bread_crumbs li {
	display: inline-block;
	margin: 0 7px 0 0;
	padding: 0 15px 0 0;
	background: url(/common/img/arrow_06.png) no-repeat 100% 2px;
	background-size: 8px auto;
}

.bread_crumbs li:last-child {
	margin: 0;
	padding: 0 5.333% 0 0;
	background: none;
}

.bread_crumbs a {
	text-decoration: underline !important;
}


/* sec_pager
--------------------*/
.sec_pager {
	padding: 30px 0 5px;
	text-align: center;
}

.sec_pager ul {
	margin: 0 3%;
	text-align: center;
}

.sec_pager li {
	display: inline-block;
	width: 35px;
	margin: 10px 0 0;
	padding: 0 5px;
	text-align: center;
	vertical-align: middle;
}

.sec_pager li a,
.sec_pager li span {
	display: block;
	border: 1px solid #29BC8F;
	border-radius: 100px;
	color: #29BC8F;
	font-size: 14px;
    font-family: 'Roboto', sans-serif;
	line-height: 33px !important;
}

.sec_pager li span {
	background: #D3D5D6;
	border: 1px solid #D3D5D6;
	color: #ffffff;
}

.sec_pager li.prev,
.sec_pager li.next {
	text-indent: -9999em;
}

.sec_pager li.prev a {
	background: url(/common/img/arrow_11.png) no-repeat 58% 50%;
	background-size: 12px auto;
}

.sec_pager li.next a {
	background: url(/common/img/arrow_10.png) no-repeat 42% 50%;
	background-size: 12px auto;
}


/* h
--------------------*/
.h_lv_01 {}


/* sec_bt
--------------------*/
/* sec_bt_01 */
.sec_bt_01 {}


/* hr
--------------------*/
hr {
	display: block;
	clear: both;
	height: 1px;
	background: #dddddd;
	border: none;
	font-size: 0;
	line-height: 0;
}

/* input
--------------------*/
input::placeholder {
  color: #BABABA;
}

input:-ms-input-placeholder {
  color: #BABABA;
}



/* Link setting
-------------------------------------*/
a:link { color: #000000; text-decoration: none; }
a:visited { color: #000000; text-decoration: none; }
a:active { color: #000000; text-decoration: none; }
a:hover { color: #000000; text-decoration: none; }


/*
===== 3: Common ===========================*/

.sp_hidden { display: none !important; }
.br_pc { display: none !important; }
#container .hidetxt { text-indent: -9999px; overflow: hidden; }
#container .ls, #container .lc { float: left; }
#container .rs, #container .rc { float: right; }
#container .tx_l { text-align: left !important; }
#container .tx_c { text-align: center !important; }
#container .tx_r { text-align: right !important; }
#container .va_t { vertical-align: top !important; }
#container .va_m { vertical-align: middle !important; }
#container .va_b { vertical-align: bottom !important; }
#container .img_txt { font-size: 0; line-height: 0; }
#container .tx_notfound { margin: 40px 0 0;}

/*--- margin ---*/
#container .mt0  { margin-top: 0px !important; }
#container .mt5  { margin-top: 5px !important; }
#container .mt10 { margin-top: 10px !important; }
#container .mt15 { margin-top: 15px !important; }
#container .mt20 { margin-top: 20px !important; }
#container .mt25 { margin-top: 25px !important; }
#container .mt30 { margin-top: 30px !important; }
#container .mt35 { margin-top: 35px !important; }
#container .mt40 { margin-top: 40px !important; }

#container .pt5  { padding-top: 5px !important; }
#container .pt10 { padding-top: 10px !important; }
#container .pt15 { padding-top: 15px !important; }
#container .pt20 { padding-top: 20px !important; }
#container .pt25 { padding-top: 25px !important; }
#container .pt30 { padding-top: 30px !important; }
#container .pt35 { padding-top: 35px !important; }
#container .pt40 { padding-top: 40px !important; }


/*
===== 4: clearfix ===========================*/

.clearfix:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
	font-size: 0;
	line-height: 0;
}

.clearfix{
	display:inline-block;
}

/* Hides from IE-mac ¥*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


/* 体温はつながる復活で消す*/
header .gnav > ul > li.gnav_relationship {
	background: #E5E5E5;
}

header .gnav > ul > li.gnav_relationship a {
	color: #9A9A9A;
	pointer-events: none;
	transition: none !important;
}

header .gnav > ul > li.gnav_relationship a img {
	visibility: hidden;
}

header .gnav > ul > li.gnav_relationship i {
	pointer-events: none;
}

header .gnav > ul > li.gnav_relationship span {
	background: url(/common/img/icon_relationship_off.png) no-repeat 2px 50%;
	background-size: 37px auto !important;
}

header .gnav > ul > li.gnav_relationship ul.child {
	display: none !important;
}

footer .sec_01 nav ul li.fnav_relationship,
#index .sec_index .sec_inner nav ul li.fnav_relationship {
	display: block;
	height: 80px;
	background: #E5E5E5;
	border-radius: 5px;
	text-align: center;
}

footer .sec_01 nav ul li.fnav_relationship a,
#index .sec_index .sec_inner nav ul li.fnav_relationship a {
	display: inline-block;
	width: auto;
	padding: 0 0 2px;
	background: url(/common/img/icon_relationship_off.png) no-repeat 0 50%;
	background-size: 37px auto;
	color: #9A9A9A;
	line-height: 78px;
	pointer-events: none !important;
}

footer .sec_01 nav ul li.fnav_relationship a img,
#index .sec_index .sec_inner nav ul li.fnav_relationship a img {
	visibility: hidden;
}

#index #wrapper .sec_cat_01 {
	display: none;
}

.sitemap .sec_sitemap .ls dl:nth-child(2) {
	display: none;
}