@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 ===========================*/

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

header.fixed {
	position: fixed;
	height: 90px;
	border-bottom: 1px solid #E6E6E6;
}

header .logo_terumo {
	padding: 24px 0 32px 50px;
	border-bottom: 2px solid #00885F;
	font-size: 0;
	line-height: 0;
}

header.fixed .logo_terumo {
	display: none;
}

header .sec_inner {
	height: 137px;
}

.index header .sec_inner {
	height: 0;
	overflow: hidden;
}

header.fixed .sec_inner {
	height: 90px;
	top: 0 !important;
	overflow: visible;
}

header .sec_inner .logo {
	position: absolute;
	top: 30px;
	left: 0;
}

header.fixed .sec_inner .logo {
	top: 20px;
}

header.fixed .sec_inner .logo img {
	width: 142px;
}

header .gnav {
	position: absolute;
	top: 30px;
	left: 258px;
}

header.fixed .gnav {
	top: 22px;
	left: 190px;
}

header .gnav > ul > li {
	position: relative;
	float: left;
	height: 100%;
	margin: 0 35px 0 0;
	line-height: 1;
}

header.fixed .gnav > ul > li {
	margin: 0 54px 0 0;
}

header .gnav > ul > li > a {
	display: block;
	position: relative;
}

header .gnav > ul > li > a > span {
	display: block;
	padding: 63px 0 10px;
	text-align: center;
}

header.fixed .gnav > ul > li > a > span {
	display: table-cell;
	height: 46px;
	padding: 0 0 20px;
	font-size: 14px;
	line-height: 1.43;
	text-align: left;
	vertical-align: middle;
}

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

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

header .gnav > ul > li > a img {
	position: absolute;
	top: 0;
	left: 50%;
	text-align: center;
	transform: translateX(-50%);
}

header.fixed .gnav > ul > li > a img {
	left: 0;
	margin: 6px 0 0 !important;
	transform: translateX(0%);
}

header .gnav > ul > li:nth-child(1) a img { margin-top: 4px; }
header .gnav > ul > li:nth-child(2) a img { margin-top: 3px; }
header .gnav > ul > li:nth-child(3) a img { margin-top: 0px; }
header .gnav > ul > li:nth-child(4) a img { margin-top: 2px; }
header .gnav > ul > li:nth-child(5) a img { margin-top: 1px; }

header.fixed .gnav > ul > li:nth-child(1) a > span { padding-left: 44px; }
header.fixed .gnav > ul > li:nth-child(2) a > span { padding-left: 51px; }
header.fixed .gnav > ul > li:nth-child(3) a > span { padding-left: 47px; }
header.fixed .gnav > ul > li:nth-child(4) a > span { padding-left: 53px; }
header.fixed .gnav > ul > li:nth-child(5) a > span { padding-left: 39px; }

header.fixed .gnav > ul > li:nth-child(1) a > img { width: 34px; }
header.fixed .gnav > ul > li:nth-child(2) a > img { width: 40px; }
header.fixed .gnav > ul > li:nth-child(3) a > img { width: 36px; }
header.fixed .gnav > ul > li:nth-child(4) a > img { width: 41px; }
header.fixed .gnav > ul > li:nth-child(5) a > img { width: 27px; }

.relationship header .gnav > ul > li.gnav_relationship > a { border-bottom: 2px solid #DD4B65; }
.health header .gnav > ul > li.gnav_health > a { border-bottom: 2px solid #F47C5E; }
.fever header .gnav > ul > li.gnav_fever > a { border-bottom: 2px solid #F69C0D; }
.basics header .gnav > ul > li.gnav_basics > a { border-bottom: 2px solid #009DA4; }
.activity header .gnav > ul > li.gnav_activity > a { border-bottom: 2px solid #226DB6; }


header .gnav > ul > li div {
	display: block !important;
	position: absolute;
	top: -9999px;
	left: 50%;
	transform: translateX(-50%);
}

header .gnav > ul > li div ul.child {
	width: 128px;
	padding: 12px 30px 25px;
	border: 1px solid #E8E8E8;
	border-radius: 5px;
	opacity: 0;
	transition: all .5s ease;
}

header .gnav > ul > li ul.child li {
	margin: 15px 0 0;
}

header .gnav > ul > li.show ul.child {
	opacity: 1;
}

header .gnav > ul > li ul.child li a {
	display: inline-block;
	padding: 0 28px 2px 0;
	background-size: 18px 18px !important;
	font-size: 14px;
	line-height: 1.25;
}

header .gnav > ul > li ul.child li a span {
	padding: 0 !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 { background: url(/common/img/arrow_01.png) no-repeat 100% 0.5px; }
header .gnav > ul > li.gnav_health ul.child li a { background: url(/common/img/arrow_02.png) no-repeat 100% 0.5px; }
header .gnav > ul > li.gnav_fever ul.child li a { background: url(/common/img/arrow_03.png) no-repeat 100% 0.5px; }
header .gnav > ul > li.gnav_basics ul.child li a { background: url(/common/img/arrow_04.png) no-repeat 100% 0.5px; }
header .gnav > ul > li.gnav_activity ul.child li a { background: url(/common/img/arrow_05.png) no-repeat 100% 0.5px; }

header .sec_search {
	position: absolute;
	top: 30px;
	right: 0;
	width: 90px;
	height: 78px;
	border-left: 1px solid #E6E6E6;
}

header.fixed .sec_search {
	top: 25px;
	height: 40px;
}

header .sec_search a {
	display: block;
}

header .sec_search a span {
	display: block;
	height: 78px;
	background-position: 50% 50%;
	line-height: 78px;
	text-align: center;
}

header.fixed .sec_search a span {
	height: 40px;
	line-height: 40px;
}

header .sec_search a.open span {
	background: url(/common/img/icon_close.png) no-repeat 50% 50%;
	background-size: 22px 22px;
}

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

header .sec_search a img {
	vertical-align: middle;
}

header .sec_search .search {
	display: none;
	position: absolute;
	top: 97px;
	right: 0;
	width: 496px;
	height: 68px;
	padding: 0 0 0 20px;
	background: #ffffff;
	border: 1px solid #E8E8E8;
	border-radius: 5px;
	z-index: 100;
}

header.fixed .sec_search .search {
	top: 55px;
}

header .sec_search .search input.text_field {
	width: 390px;
	margin: 21px 0 0;
	padding: 0;
	background: none;
	border: none;
	text-align: center;
	vertical-align: middle;
	outline: none;
}

header .sec_search .search input.search_btn {
	position: absolute;
	top: -1px;
	right: -1px;
	width: 90px;
	height: 70px;
	border-radius: 0 5px 5px 0;
	transition: all .3s ease;
}

header .sec_search .search input.search_btn:hover {
	opacity: 0.5;
	cursor: pointer;
}


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

/* .sec_01 */
footer .sec_01 {
	padding: 70px 0 60px;
}

footer .sec_01 nav ul li {
	float: left;
	width: 202px;
	margin: 0 20px 0 0;
}

footer .sec_01 nav ul li:last-child {
	margin: 0;
}

footer .sec_01 nav ul li a {
	display: block;
	position: relative;
	background: #ffffff;
	border-radius: 5px;
	line-height: 1;
	text-align: center;
}

footer .sec_01 nav ul li a span {
	display: block;
	padding: 102px 0 20px;
	text-align: center;
}

footer .sec_01 nav ul li a img {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}

footer .sec_01 nav ul li:nth-child(1) a img { top: 27px; }
footer .sec_01 nav ul li:nth-child(2) a img { top: 25px; }
footer .sec_01 nav ul li:nth-child(3) a img { top: 21px; }
footer .sec_01 nav ul li:nth-child(4) a img { top: 24px; }
footer .sec_01 nav ul li:nth-child(5) a img { top: 22px; }

footer .sec_01 .sec_search .search {
	position: relative;
	width: 704px;
	height: 64px;
	margin: 30px auto 0;
	padding: 0 0 0 20px;
	background: #ffffff;
	border: 2px solid #ffffff;
	border-radius: 5px;
	overflow: hidden;
}

footer .sec_01 .sec_search .search input.text_field {
	width: 550px;
	margin: 21px 0 0;
	padding: 0;
	background: none;
	border: none;
	text-align: center;
	vertical-align: middle;
	outline: none;
}

footer .sec_01 .sec_search .search input.search_btn {
	position: absolute;
	top: -1px;
	right: -1px;
	width: 132px;
	height: 70px;
	border-radius: 0 5px 5px 0;
	transition: all .3s ease;
}

footer .sec_01 .sec_search .search input.search_btn:hover {
	opacity: 0.5;
	cursor: pointer;
}

/* .sec_02 */
footer .sec_02 {
	padding: 60px 0 80px;
	background-color: rgba(0,0,0,0.05);
}

footer .sec_02 .sec_nav_01 li {
	float: left;
	width: 350px;
	margin: 0 21px 0 0;
}

footer .sec_02 .sec_nav_01 li:last-child {
	margin: 0;
}

footer .sec_02 .sec_nav_01 li a {
	display: table-cell;
	position: relative;
	width: 350px;
	height: 140px;
	background: #ffffff;
	border-radius: 5px;
	color: #29BC8F;
	font-size: 24px;
	line-height: 1.4;
	text-align: left;
	vertical-align: middle;
}

footer .sec_02 .sec_nav_01 li.nav_about a span {
	display: block;
	padding: 0 0 0 122px;
	letter-spacing: 0.05em;
}

footer .sec_02 .sec_nav_01 li.nav_about a img {
	position: absolute;
	top: 34px;
	left: 30px;
}

footer .sec_02 .sec_nav_01 li.nav_download a span {
	display: block;
	padding: 0 0 0 146px;
}

footer .sec_02 .sec_nav_01 li.nav_download a img {
	position: absolute;
	top: 30px;
	left: 52px;
}

footer .sec_02 .sec_nav_01 li.nav_download a i {
	display: block;
	margin: 6px 0 0;
	font-size: 12px;
	letter-spacing: 0.05em;
}

footer .sec_02 .sec_nav_01 li.nav_quiz a {
	text-align: center;
}

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

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

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

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

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

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

footer .sec_02 .sec_nav_02 {
	margin: 50px 0 0;
}

footer .sec_02 .sec_nav_02 li {
	float: left;
	width: 350px;
	margin: 0 20px 0 0;
}

footer .sec_02 .sec_nav_02 li:last-child {
	margin: 0;
}

footer .sec_02 .sec_nav_02 li a {
	display: table-cell;
	position: relative;
	width: 350px;
	height: 140px;
	background: #ffffff;
	border-radius: 5px;
	color: #000000;
	font-size: 18px;
	line-height: 1.5;
	letter-spacing: 0.05em;
	text-align: center;
	vertical-align: middle;
}

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

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

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_share {
	margin: 60px 0 0;
	text-align: center;
	font-size: 0;
	line-height: 0;
}

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

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

/* .sec_03 */
footer .sec_03 {
	padding: 60px 0;
	background: #ffffff;
}

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

footer .sec_03 nav ul + ul {
	margin: 20px 0 0;
}

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

footer .sec_03 nav li a {
	display: inline-block;
	letter-spacing: 0.05em;
}

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

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

footer .sec_03 .sec_share_01 {
	margin: 0;
}

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

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

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

footer .sec_03 .copyright {
	margin: 40px 0 0;
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0.1em;
	text-align: center;

}

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


/* container
--------------------*/
#container {
	position: relative;
	min-width: 1366px;
	overflow: hidden;
}

#container .sec_inner {
	position: relative;
	width: 1092px;
	margin: 0 auto;
}


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


/* wrapper
--------------------*/
#wrapper {
	margin: 228px 0 0;
	position: relative;
}

.index #wrapper {
	margin: 90px 0 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_item .sec_tag_list_01 li a:hover {
	background: #29BC8F;
	color: #ffffff;
	opacity: 1;
}

.sec_item.hover dt a,
.sec_item.hover dd p a {
	opacity: 0.5;
}

/* sec_recommend
--------------------*/
.sec_recommend {
	margin: 80px 0 0;
}

.sec_recommend h3 {
	color: #29BC8F;
	font-size: 40px;
	text-align: center;
	line-height: 1;
}

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

.sec_recommend .ms .ls,
.sec_recommend .ms .rs {
	width: 516px;
}

.sec_recommend .ms dd p {
	margin: 20px 0;
	font-size: 18px;
	line-height: 1.55;
}

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

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

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

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

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

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


/* bread_crumbs
--------------------*/
.bread_crumbs {
	padding: 17px 0 19px;
	background: #F8F8F8;
	font-size: 12px;
	line-height: 1.5;
}

.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 li {
	display: inline-block;
	margin: 0 8px 0 0;
	padding: 0 18px 0 0;
	background: url(/common/img/arrow_06.png) no-repeat 100% 6px;
	background-size: 8px auto;
}

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

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


/* sec_pager
--------------------*/
.sec_pager {
	width: 1092px;
	margin: 60px auto 0;
	text-align: center;
}

.sec_pager li {
	display: inline-block;
	margin: 0 8px;
}

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

.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: 16px auto;
}

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



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


/* sec_bt
--------------------*/
/* sec_bt_01 */
.sec_bt_01 a {
	background: #000000;
}


/* 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; transition: all .3s; }
a:visited { color: #000000; text-decoration: none; }
a:active { color: #000000; text-decoration: none; }
a:hover { color: #000000; text-decoration: none; opacity: 0.5; }
.imgover { transition: all .3s; }
.imgover:hover { opacity: 0.5; }


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

.pc_hidden { display: none !important; }
.br_sp { display: none !important; }
.sp_tel { color: #3e3e3e !important; text-decoration: 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: 75px 0 0; text-align: center; }

/*--- 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 a {
	background: url(/common/img/icon_relationship_off_02.png) no-repeat 50% 4px;
	background-size: 47px auto;
	color: #9A9A9A;
	pointer-events: none;
	transition: none !important;
}

header.fixed .gnav > ul > li.gnav_relationship a {
	background: url(/common/img/icon_relationship_off_02.png) no-repeat 0 6px;
	background-size: 34px auto;
}

header .gnav > ul > li.gnav_relationship a span {
	width: 112px;
}

header.fixed .gnav > ul > li.gnav_relationship a span {
	width: auto;
}

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

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

footer .sec_01 nav ul li.fnav_relationship a,
#index .sec_index .sec_inner nav ul li.fnav_relationship a {
	background: #E5E5E5 url(/common/img/icon_relationship_off.png) no-repeat 50% 27px;
	background-size: 65px auto;
	color: #9A9A9A;
	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;
}