/* latin-ext */
@font-face {
font-family: "Lato";
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(../fonts/Lato-Thin.ttf) format("truetype");
}

/* latin-ext */
@font-face {
font-family: "Lato";
font-style: normal;
font-weight: 300;
font-display: swap;
src: url(../fonts/Lato-Light.ttf) format("truetype");
}

/* latin-ext */
@font-face {
font-family: "Lato";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(../fonts/Lato-Regular.ttf) format("truetype");
}

/* latin-ext */
@font-face {
font-family: "Lato";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(../fonts/Lato-Bold.ttf) format("truetype");
}

/* latin-ext */
@font-face {
font-family: "Lato";
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(../fonts/Lato-Black.ttf) format("truetype");
}

html {
font-size: 16px;
}

body {
font-family: "Lato", sans-serif;
background-image: url(../images/bg.png);
overflow-x: hidden;
}

/*header and footer*/
#main {
display: flow-root;
position: relative;
min-height: 100vh;
z-index: 200;
background: rgba(255, 255, 255, 0.5);
}

.home-wrap {
margin-bottom: 50px;
}
.home-wrap .row {
margin-left: -7px;
margin-right: -7px;
}
.home-wrap .row [class^="col-"] {
padding-left: 7px;
padding-right: 7px;
}

.hide {
opacity: 0;
}

.navbar-collapse {
position: fixed;
top: 0;
right: 0;
background-color: rgba(255, 255, 255, 0.9);
width: 60%;
height: 100%;
transform: translateX(100%);
transition: 0.5s;
z-index: 15;
}
@media (min-width: 992px) {
.navbar-collapse {
width: 30%;
}
}
.navbar-collapse.show {
transform: translateX(0%);
}
.navbar-collapse .navbar-nav {
margin: 90px 0 0 0;
}
.navbar-collapse .navbar-nav .nav-item {
padding: 10px 20px;
}
.navbar-collapse .navbar-nav .nav-item a {
font-size: 14px;
font-weight: 500;
padding-bottom: 5px;
border-bottom: 1px solid #dadada;
color: #787878;
}
@media (min-width: 992px) {
.navbar-collapse .navbar-nav .nav-item a {
font-size: 18px;
}
}
.navbar-collapse .navbar-nav .nav-item a:hover {
color: #333333;
}
.navbar-collapse .navbar-nav .nav-item a.active {
color: #333333;
font-weight: bold;
}
.navbar-collapse .navbar-toggler {
position: absolute;
width: 30px;
height: 30px;
top: 55px;
right: 15px;
}
.navbar-collapse .navbar-toggler:focus {
outline: none;
}
.navbar-collapse .navbar-toggler span {
width: 30px;
height: 2px;
background-color: black;
position: absolute;
top: 12px;
left: 0;
}
.navbar-collapse .navbar-toggler span:nth-child(1) {
transform: rotate(45deg);
}
.navbar-collapse .navbar-toggler span:nth-child(2) {
transform: rotate(-45deg);
}

img {
max-width: 100%;
height: auto;
}

.main-navbar {
position: relative;
margin-top: 40px;
margin-bottom: 10px;
align-items: flex-start;
}
.main-navbar h1#logo {
font-family: "Lato", sans-serif;
font-weight: 700;
font-size: 25px;
}
@media (min-width: 768px) {
.main-navbar h1#logo {
font-size: 30px;
}
}
@media (min-width: 992px) {
.main-navbar h1#logo {
font-size: 30px;
}
}
.main-navbar h1#logo a {
color: #444444;
text-decoration: none;
}
.main-navbar h1#logo1 {
font-family: "Lato", sans-serif;
font-weight: 700;
letter-spacing: 12px;
position: absolute;
top: 15px;
left: 50%;
font-size: 28px;
line-height: 15px;
transform: translateX(-50%);
z-index: 2;
}
@media (min-width: 768px) {
.main-navbar h1#logo1 {
font-size: 30px;
left: 0;
top: 15px;
position: relative;
margin: 0 auto 0 50%;
letter-spacing: 5px;
}
}
@media (min-width: 992px) {
.main-navbar h1#logo1 {
font-size: 55px;
letter-spacing: 18px;
line-height: 10px;
margin-bottom: 60px;
transform: translateX(-50%);
}
}
.main-navbar h1#logo1 a {
color: #444444;
text-decoration: none;
}
.main-navbar .navbar-toggler .navbar-toggler-icon {
background: #111;
height: 2px;
display: block;
margin: 7px 0;
width: 1.8em;
}
.main-navbar .navbar-collapse {
background: #fff;
padding: 15px;
position: absolute;
top: 100%;
right: 15px;
width: 320px;
z-index: 2;
}

.form-control {
border-color: #c7c7c7;
border-radius: 0;
}

.item-top {
position: relative;
color: #fff;
}
.item-top img {
opacity: 1;
-webkit-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
.item-top:hover img {
opacity: 0.7;
}
.item-top h2 {
font-size: 3.9vw;
line-height: 0.9;
/* position: absolute; */
z-index: 10;
bottom: 0;
left: 0;
right: 0;
margin-bottom: 12px;
/* padding: 5px 7px; */
color: #fff;
/* background: rgba(0, 0, 0, 0.3);  */
}

@media (min-width: 1201px) {
.item-top h2 {
font-size: 52px;
}
}
@media (max-width: 1200px) {
.item-top h2 {
font-size: 3.7vw;
}
}
@media (max-width: 992px) {
.item-top h2 {
font-size: 3.1vw;
}
}
@media (max-width: 768px) {
.item-top h2 {
font-size: 8vw;
}
}
.item-detail {
font-size: 13px;
margin-bottom: 0;
}
.item-top {
padding: 20px;
}
.col-md-8 .item-top {
background: #858585;
/* padding: 20px; */
}
.col-md-4 .item-top {
background: #eaa89d;
}
.col-md-4 .item-top.type2 {
background: #858585;
}

.container a:hover {
text-decoration: none;
}
@media (min-width: 992px) {
/* .item-top h2 {
font-size: 3.9vw;
line-height: 1; */
}

#footer {
text-align: center;
padding: 10px;
background-color: rgba(0, 0, 0, 0.7);
color: #b4b4b4;
}
#footer.footer-top {
bottom: 0;
left: 0;
width: 100%;
}

.footer_left {
padding-bottom: 10px;
}
@media (min-width: 768px) {
.footer_left {
padding-bottom: 20px;
}
}
@media (min-width: 992px) {
.footer_left {
padding-bottom: 30px;
}
}

.footer_nav {
list-style-type: none;
margin: 0;
padding: 0 10px;
overflow: hidden;
}
.footer_nav li {
float: left;
width: 50%;
}
@media (min-width: 768px) {
.footer_nav li {
width: 33.33%;
}
}
@media (min-width: 992px) {
.footer_nav li {
width: 33.33%;
text-align: center;
}
}
.footer_nav li a {
font-family: "Lato", sans-serif;
font-weight: 300;
font-size: 12px;
display: block;
color: white;
text-align: left;
padding: 3px;
text-decoration: none;
}
@media (min-width: 768px) {
.footer_nav li a {
font-size: 16px;
text-align: center;
padding: 10px;
}
}
@media (min-width: 992px) {
.footer_nav li a {
font-size: 18px;
text-align: center;
padding: 14px;
}
}
.footer_nav li a:hover {
text-decoration: underline;
color: rgba(255, 255, 255, 0.8);
}

.text-center span {
text-align: center;
font-size: 12px;
}

.show-pc {
display: none;
}

@media (min-width: 768px) {
.show-pc {
display: block;
}
.show-mb {
display: none;
}
.item-top h2 {
/* font-size: 3.9vw;
line-height: 1; */
/* margin-bottom: 10px; */
}
}

.language {
display: flex;
align-items: center;
}
@media (max-width: 992px) {
.language {
flex-direction: column;
margin-left: auto;
}
}
.language button {
padding: 0;
margin-left: auto;
}
@media (min-width: 992px) {
.language button {
margin-left: 20px;
}
}
.language ol {
margin: 0;
padding: 10px 0;
}
@media (max-width: 992px) {
.language ol {
order: 2;
}
}

/*content about_proteoglycan*/
.banner {
margin-bottom: 25px;
}
@media (min-width: 768px) {
.banner {
margin-bottom: 50px;
}
}
.banner img {
width: 100%;
height: auto;
}

.title h1 {
font-size: 25px;
font-family: "Lato", sans-serif;
font-weight: 700;
}
@media (min-width: 768px) {
.title h1 {
font-size: 50px;
}
}
@media (min-width: 992px) {
.title h1 {
font-size: 60px;
}
}

.breadcrumb .breadcrumb-item a {
color: #333333 !important;
text-decoration: underline;
font-family: "Lato", sans-serif;
font-weight: 400;
}

.breadcrumb .language-item {
padding-top: 30px;
}

.breadcrumb .breadcrumb-item.active {
font-family: "Lato", sans-serif;
font-weight: 400;
color: #333333 !important;
}

@media (min-width: 992px) {
.breadcrumb {
font-size: 13px;
}
}

.content-about {
display: inline-block;
width: 100%;
background: #ffffff;
margin-bottom: 30px;
}
@media (min-width: 768px) {
.content-about {
margin-bottom: 40px;
}
}
@media (min-width: 992px) {
.content-about {
margin-bottom: 60px;
}
}
.content-about #review-data {
display: none;
}
.content-about #review-data .list-button {
text-align: center;
}
.content-about #review-data .list-button button {
width: 300px;
max-width: 100%;
padding-top: 10px;
padding-bottom: 10px;
margin: 10px 0;
border-radius: 0;
background: #444;
position: relative;
}
.content-about #review-data .list-button button:after {
content: "";
position: absolute;
width: 10px;
height: 10px;
border: 2px solid;
border-color: #fff #fff transparent transparent;
right: 20px;
top: 16px;
transform: rotate(45deg);
}
.content-about #review-data .list-button button:hover {
background: #666;
}
.content-about #review-data .list-button button#edit_form {
border: 2px solid #444;
background: #fff;
}
.content-about #review-data .list-button button#edit_form:hover {
background: #efefef;
}
.content-about #review-data .list-button button#edit_form:after {
border: 2px solid;
border-color: #444 #444 transparent transparent;
left: 20px;
transform: rotate(-135deg);
}
@media (min-width: 768px) {
.content-about #review-data .list-button button {
margin: 10px;
}
}
.content-about .btn-submit-contact {
width: 300px;
max-width: 100%;
padding-top: 10px;
padding-bottom: 10px;
border-radius: 0;
background: #444;
color: #fff;
position: relative;
}
.content-about .btn-submit-contact:hover {
background: #666;
}
.content-about .btn-submit-contact:after {
content: "";
position: absolute;
width: 10px;
height: 10px;
border: 2px solid;
border-color: #fff #fff transparent transparent;
right: 20px;
top: 16px;
transform: rotate(45deg);
}
.content-about .success-form {
display: none;
}
.content-about .success-form p {
margin-bottom: 30px;
}

#contact_us_form label.error {
color: red;
margin-top: 10px;
}

.sub-content {
padding: 30px 10px;
}
@media (min-width: 768px) {
.sub-content {
padding: 60px 40px;
}
}
.sub-content .sub-content-1 {
margin-bottom: 20px;
}
@media (min-width: 768px) {
.sub-content .sub-content-1 {
margin-bottom: 30px;
}
}
@media (min-width: 992px) {
.sub-content .sub-content-1 {
margin-bottom: 40px;
}
}
.sub-content .sub-content-1 .content-img img {
width: 100%;
height: auto;
}
.sub-content .sub-content-1 h1 {
font-size: 21px;
font-family: "Lato", sans-serif;
font-weight: 500;
}
@media (min-width: 768px) {
.sub-content .sub-content-1 h1 {
font-size: 26px;
}
}
@media (min-width: 992px) {
.sub-content .sub-content-1 h1 {
font-size: 30px;
}
}
.sub-content .sub-content-1 p {
font-family: "Lato", sans-serif;
font-weight: 300;
font-size: 14px;
}
@media (min-width: 768px) {
.sub-content .sub-content-1 p {
font-size: 16px;
}
}
@media (min-width: 992px) {
.sub-content .sub-content-1 p {
font-size: 18px;
}
}
.sub-content .sub-content-1 img {
height: auto;
max-width: 100%;
}
.sub-content .sub-content-end {
background-color: rgba(0, 0, 0, 0.7);
padding: 20px 20px;
}
.sub-content .sub-content-end p {
color: #ffffff;
font-weight: bold;
font-size: 14px;
}
@media (min-width: 768px) {
.sub-content .sub-content-end {
text-align: center;
}
.sub-content .sub-content-end p {
font-size: 16px;
}
}
@media (min-width: 992px) {
.sub-content .sub-content-end p {
font-size: 18px;
}
}

.breadcrumb {
background: none;
}

/*=======================*/
/*content linise proteoglycan*/
.img-mt-5 {
padding-top: 20px;
}
@media (min-width: 768px) {
.img-mt-5 {
padding-top: 30px;
}
}
@media (min-width: 992px) {
.img-mt-5 {
padding-top: 40px;
}
}

.sub-content-1 .text-pro {
padding-bottom: 10px;
}
@media (min-width: 768px) {
.sub-content-1 .text-pro {
padding-bottom: 20px;
}
}
@media (min-width: 992px) {
.sub-content-1 .text-pro {
padding-bottom: 25px;
}
}

.sub-content-linise-end {
padding-bottom: 20px;
}
@media (min-width: 768px) {
.sub-content-linise-end {
padding-bottom: 30px;
}
}
@media (min-width: 992px) {
.sub-content-linise-end {
padding-bottom: 40px;
}
}
.sub-content-linise-end h1 {
font-size: 21px;
font-family: "Lato", sans-serif;
font-weight: 500;
}
@media (min-width: 768px) {
.sub-content-linise-end h1 {
font-size: 26px;
}
}
@media (min-width: 992px) {
.sub-content-linise-end h1 {
font-size: 30px;
}
}
.sub-content-linise-end p {
font-family: "Lato", sans-serif;
font-weight: 300;
font-size: 14px;
}
@media (min-width: 768px) {
.sub-content-linise-end p {
font-size: 16px;
}
}
@media (min-width: 992px) {
.sub-content-linise-end p {
font-size: 18px;
}
}

/*=============================*/
/*RESEARCH*/
.text-detail .span {
width: 100%;
display: flex;
font-family: "Lato", sans-serif;
font-weight: 300;
font-size: 14px;
}
@media (min-width: 768px) {
.text-detail .span {
font-size: 16px;
}
}
@media (min-width: 992px) {
.text-detail .span {
font-size: 18px;
}
}
.text-detail .span span {
flex: 1;
}

.text-detail .span:before {
content: "";
display: inline-block;
width: 10px;
height: 10px;
margin-right: 10px;
margin-top: 7px;
background: #000000;
}
@media (min-width: 768px) {
.text-detail .span:before {
margin-top: 9px;
}
}
@media (min-width: 992px) {
.text-detail .span:before {
margin-top: 10px;
}
}

.text-note {
font-family: "Lato", sans-serif;
font-weight: 500;
font-size: 14px;
}
@media (max-width: 768px) {
.text-note {
margin-top: 16px;
}
}
@media (min-width: 768px) {
.text-note {
font-size: 16px;
}
}
@media (min-width: 992px) {
.text-note {
font-size: 18px;
}
}

.text-author {
font-family: "Lato", sans-serif;
font-weight: 300;
font-size: 14px;
}
@media (max-width: 768px) {
.text-author {
margin-top: 10px;
}
}
@media (min-width: 768px) {
.text-author {
font-size: 16px;
}
}
@media (min-width: 992px) {
.text-author {
font-size: 18px;
}
}

.title-research {
font-family: "Lato", sans-serif;
font-weight: 500;
text-align: center;
font-size: 25px;
}
@media (min-width: 768px) {
.title-research {
font-size: 25px;
}
}
@media (min-width: 992px) {
.title-research {
font-size: 30px;
}
}

.sub-content-end-research h1,
.sub-content-end-safety h1,
.sub-content-end-linise h1 {
font-size: 21px;
font-family: "Lato", sans-serif;
font-weight: 500;
}
@media (min-width: 768px) {
.sub-content-end-research h1,
.sub-content-end-safety h1,
.sub-content-end-linise h1 {
font-size: 26px;
}
}
@media (min-width: 992px) {
.sub-content-end-research h1,
.sub-content-end-safety h1,
.sub-content-end-linise h1 {
font-size: 30px;
}
}

.sub-content-end-research p,
.sub-content-end-safety p,
.sub-content-end-linise p {
font-family: "Lato", sans-serif;
font-weight: 300;
font-size: 14px;
}
@media (min-width: 768px) {
.sub-content-end-research p,
.sub-content-end-safety p,
.sub-content-end-linise p {
font-size: 16px;
}
}
@media (min-width: 992px) {
.sub-content-end-research p,
.sub-content-end-safety p,
.sub-content-end-linise p {
font-size: 18px;
}
}

.item-top .catch {
color: #fff;
background: #4a4854;
font-size: 14px;
padding: 3px 4px 3px 7px;
line-height: 1.1;
margin-bottom: 8px;
}

/*==============================*/
/*safety*/
.text-detail-safety .span {
width: 100%;
display: flex;
font-family: "Lato", sans-serif;
font-weight: 300;
font-size: 14px;
}
@media (min-width: 768px) {
.text-detail-safety .span {
font-size: 16px;
}
}
@media (min-width: 992px) {
.text-detail-safety .span {
font-size: 18px;
}
}
.text-detail-safety .span span {
flex: 1;
}

.text-detail-safety .span:before {
content: "";
display: inline-block;
width: 10px;
height: 10px;
margin-right: 10px;
margin-top: 7px;
border-radius: 7.5px;
background: #000000;
}
@media (min-width: 768px) {
.text-detail-safety .span:before {
margin-top: 9px;
}
}
@media (min-width: 992px) {
.text-detail-safety .span:before {
margin-top: 10px;
}
}

/*==============================*/
/*about linise*/
.text-detail-linise {
font-family: "Lato", sans-serif;
font-weight: 300;
font-size: 14px;
}
@media (min-width: 768px) {
.text-detail-linise {
font-size: 16px;
}
}
@media (min-width: 992px) {
.text-detail-linise {
font-size: 18px;
}
}
.text-detail-linise .span {
width: 100%;
display: inline-block;
}
@media (min-width: 768px) {
.text-detail-linise .span {
display: flex;
}
}
@media (min-width: 992px) {
.text-detail-linise .span {
display: flex;
}
}
.text-detail-linise .span span {
flex: 1;
}

.sub-content-end-linise p {
font-family: "Lato", sans-serif;
font-weight: 300;
font-size: 10px;
padding-top: 10px;
}
@media (min-width: 768px) {
.sub-content-end-linise p {
font-size: 12px;
}
}
@media (min-width: 992px) {
.sub-content-end-linise p {
font-size: 14px;
}
}

.sub-content-end-linise .logo1 {
text-align: center;
}
.sub-content-end-linise .logo1 img {
display: block;
margin: auto;
width: 100px;
height: auto;
}

.sub-content-end-linise .logo2 {
text-align: center;
}
.sub-content-end-linise .logo2 img {
display: block;
margin: auto;
width: 130px;
height: auto;
}

.sub-content-end-linise .logo3 {
text-align: center;
}
.sub-content-end-linise .logo3 img {
width: 130px;
height: auto;
}

/*==============================*/

.weight_b {
font-weight: bold !important;
}
.m_b0 {
margin-bottom: 0 !important;
}

.sub-content-end-research {
border: 1px solid #ccc;
padding: 20px;
}

/* youtubeレスポンシブ対応 */
.youtube {
position: relative;
width: 100%;
padding-top: 56.25%;
}
.youtube iframe {
position: absolute;
top: 0;
right: 0;
width: 100% !important;
height: 100% !important;
}

.m16 {
margin-bottom: 16px;
}

.h-100 {
min-height: 250px;
}

@media (max-width: 768px) {
.h-100 {
min-height: 0;
}
}

/* 200415 youtube動画追加 */
.product-list {
padding: 0;
margin: 0;
}
.product-list li {
padding-left: 1rem;
list-style: none;
}

@media (max-width: 768px) {
.txt-movie {
margin-bottom: 7px;
}
}

/* 200428 Clinical新規ページ追加 */
.clinical-1 {
border: 1px solid #ccc;
padding: 20px;
}
.clinical_lead_more_area {
padding: 0;
}
.flex_area .flex_box {
display: flex;
width: auto;
margin-bottom: 5px;
}
.flex_area .flex_box:last-child {
margin-bottom: 60px;
}
.flex_area .flex_box .flex_cont {
display: block;
width: 47%;
/* margin-right: 6%; */
}
.flex_area .flex_box .flex_cont.arrow_area {
width: 6%;
/* position: relative; */
display: flex;
}
/* .flex_area .flex_box .flex_cont:first-child{
position: relative;
} */
.arrow {
/* position: absolute;
content: ""; */
border-bottom: 23px solid #ee847d;
border-left: 23px solid transparent;
border-right: 23px solid transparent;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 0;
height: 0;
transform: rotate(90deg);
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
}
.flex_area .flex_box .flex_cont:last-child {
margin-right: 0;
}

.under_txt {
margin-top: 10px;
margin-bottom: 20px !important;
}
.list_top_txt {
margin-top: 20px;
margin-bottom: 0;
}
.check_list {
list-style: none;
padding-left: 0;
margin-bottom: 0;
}
.check_list li {
text-indent: -1em;
padding-left: 1em;
font-size: 18px;
font-weight: 300;
}
.col-md-12.text-detail-clinical {
padding-left: 0;
padding-right: 0;
}
.col-md-6 .caption {
margin-top: 5px;
}
.caption {
font-size: 12px !important;
margin-bottom: 0;
}
.mb0 {
margin-bottom: 0 !important;
}
span.caption {
display: block;
}
@media (max-width: 768px) {
.flex_area .flex_box {
display: block;
margin-bottom: 40px;
}
.flex_area .flex_box:last-child {
margin-bottom: 0;
}
.flex_area .flex_box .flex_cont {
width: 100%;
margin-right: 0;
margin-bottom: 10px;
}
.flex_area .flex_box .flex_cont.arrow_area {
width: 100%;
}
.arrow {
position: static;
display: block;
margin-top: 10px;
transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
}
.check_list li {
font-size: 14px;
}
}
@media (min-width: 769px) and (max-width: 992px) {
.flex_area .flex_box .flex_cont.arrow_area {
display: flex;
align-items: center;
justify-content: center;
width: auto;
margin: auto;
}
.flex_area .flex_box .flex_cont.arrow .arrow {
position: static;
}
}

cite{
font-style: normal;
flex: 1;
}

.flex-1 {
    flex: 1;
}

@media (min-width: 769px) {
    .text-indent {
        text-indent: 30px;
    }
}