@charset "utf-8";

/* ************************************************ 
*	よくあるご質問　企業・治験依頼者の方
* ************************************************ */	
.re-faq-wrapper {
position: relative;
width: 1040px;
margin: 0 auto 100px auto;
}

/* ナビゲーションボタン */
.re-faq-navbtnbox {
padding: 0;
margin: 0 auto 60px auto;
}
.re-faq-navbtnbox-inner {
padding: 0;
margin: 0;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;
}
.re-faq-navbtnbox-inner li{
width: 25%;
padding: 0;
margin: 0;
position:relative;
}
.re-faq-navbtnbox-inner li.sponsor a,
.re-faq-navbtnbox-inner li.researcher a,
.re-faq-navbtnbox-inner li.patient a,
.re-faq-navbtnbox-inner li.other a{
box-sizing: border-box;
display: block;
align-content: center;
width: 100%;
font-size: 18px;
padding: 50px 0 14px 0;
line-height:1.6;
color: #717171;
border-bottom: 2px solid #D9D9D9;
text-align: center;
margin: auto;
}

.re-faq-navbtnbox-inner li.sponsor a::before,
.re-faq-navbtnbox-inner li.researcher a::before,
.re-faq-navbtnbox-inner li.patient a::before,
.re-faq-navbtnbox-inner li.other a::before {
position:absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
content:"";
display:inline-block;
width: 36px;
height: 36px;
background-size:contain!important;
opacity:0.5;
}

.re-faq-navbtnbox-inner li.sponsor a::before {
background:url("../images/faq/icon_sponsor.svg") no-repeat;
}
.re-faq-navbtnbox-inner li.researcher a::before {
background:url("../images/faq/icon_researcher.svg") no-repeat;
}
.re-faq-navbtnbox-inner li.patient a::before {
background:url("../images/faq/icon_patient.svg") no-repeat;
}
.re-faq-navbtnbox-inner li.other a::before {
background:url("../images/faq/icon_other.svg") no-repeat;
}

.re-faq-navbtnbox-inner li.sponsor a:hover::before,
.re-faq-navbtnbox-inner li.researcher a:hover::before,
.re-faq-navbtnbox-inner li.patient a:hover::before,
.re-faq-navbtnbox-inner li.other a:hover::before,
.re-faq-navbtnbox-inner li.sponsor.current a::before,
.re-faq-navbtnbox-inner li.researcher.current a::before,
.re-faq-navbtnbox-inner li.patient.current a::before,
.re-faq-navbtnbox-inner li.other.current a::before {
opacity:1;
transition: all 0.5s;
}


.re-faq-navbtnbox-inner li.sponsor a:hover,
.re-faq-navbtnbox-inner li.sponsor.current a{
border-bottom: 2px solid #30A693;
color: #222222;
}
.re-faq-navbtnbox-inner li.researcher a:hover,
.re-faq-navbtnbox-inner li.researcher.current a{
border-bottom: 2px solid #FF667E;
color: #222222;
}
.re-faq-navbtnbox-inner li.patient a:hover,
.re-faq-navbtnbox-inner li.patient.current a{
border-bottom: 2px solid #00B5DA;
color: #222222;
}
.re-faq-navbtnbox-inner li.other a:hover,
.re-faq-navbtnbox-inner li.other.current a{
border-bottom: 2px solid #FF9938;
color: #222222;
}


/* ページナビ */
.re-faq-pagenavbox-sponsor,
.re-faq-pagenavbox-researcher,
.re-faq-pagenavbox-patient,
.re-faq-pagenavbox-other {
padding: 20px 20px 12px 20px;
margin: 0 0 60px 0;
background-color: #F8F8F8;
border-radius: 10px;
}

.re-faq-pagenavbox-sponsor ul,
.re-faq-pagenavbox-researcher ul,
.re-faq-pagenavbox-patient ul,
.re-faq-pagenavbox-other ul{
padding: 0;
margin: 0;
display: flex;
justify-content: start;
flex-wrap: wrap;
align-items: center;
align-content: center;
}
.re-faq-pagenavbox-sponsor li,
.re-faq-pagenavbox-researcher li,
.re-faq-pagenavbox-patient li,
.re-faq-pagenavbox-other li{
padding: 0;
margin: 0 12px 8px 0;
}
.re-faq-pagenavbox-sponsor li a,
.re-faq-pagenavbox-researcher li a,
.re-faq-pagenavbox-patient li a,
.re-faq-pagenavbox-other li a{
font-size: 14px;
color: #222;
padding: 8px 13px 8px 11px;
line-height:1;
border: 1px solid #D9D9D9;
border-radius: 4px;
background-color: #fff;
}
.re-faq-pagenavbox-sponsor li a::before,
.re-faq-pagenavbox-researcher li a::before,
.re-faq-pagenavbox-patient li a::before,
.re-faq-pagenavbox-other li a::before {
position:relative;
top: 0px;
left: 0px;
content:"";
display:inline-block;
padding-right: 9px;
width:12px;
height:12px;
background-size:contain;
transition: all 0.5s;
}
.re-faq-pagenavbox-sponsor li a::before {
background:url("../images/faq/down_arrow_sponsor.svg") no-repeat;
}
.re-faq-pagenavbox-researcher li a::before {
background:url("../images/faq/down_arrow_researcher.svg") no-repeat;
}
.re-faq-pagenavbox-patient li a::before {
background:url("../images/faq/down_arrow_patient.svg") no-repeat;
}
.re-faq-pagenavbox-other li a::before {
background:url("../images/faq/down_arrow_other.svg") no-repeat;
}
.re-faq-pagenavbox-sponsor li a:hover{
color: #30A693;
}
.re-faq-pagenavbox-researcher li a:hover{
color: #FF667E;
}
.re-faq-pagenavbox-patient li a:hover{
color: #00B5DA;
}
.re-faq-pagenavbox-other li a:hover{
color: #FF9938;
}


/* 検索 */
.re-faq-searchbox {
padding: 0;
margin: 0 auto 100px auto;
display: flex;
justify-content: center;
width: 100%;
max-width: 640px;
}
.re-faq-searchbox form{
margin: 0;
width: 100%;
}
#faq-search-text{
box-sizing: border-box;
-webkit-appearance:none;/*SafariやChromeのデフォルトの設定を無効*/
width: 100%;
height: 68px;
margin: 0;
padding: 0 50px 0 32px;
border: 1px solid #D9D9D9;
background: url("../images/common/icon_search_bk.svg") no-repeat;
background-position: center right 20px;
background-color: rgba(255,255,255,0);
background-size: 26px 26px;
transition: all 0.5s;
outline: none;
cursor: pointer;
font-size: 20px;
border-radius: 50vh;
box-shadow: none;
color: #222;
}
#faq-search-text::placeholder{
color: #717171;
}
input::-webkit-search-cancel-button {
appearance: none;
}


/* 見出し */
.re-faq-sponsor-midashititle,
.re-faq-researcher-midashititle,
.re-faq-patient-midashititle,
.re-faq-other-midashititle {
font-size: 32px;
line-height: 1;
font-weight: 400;
margin: 0;
padding: 40px 0 60px 60px;
border-top: 1px solid #ddd;
position: relative;
}
.re-faq-sponsor-midashititle {
background: url("../images/faq/icon_sponsor.svg") no-repeat;
background-position: left 0 top 30px;
background-size: 48px 48px;
}
.re-faq-researcher-midashititle {
background: url("../images/faq/icon_researcher.svg") no-repeat;
background-position: left 0 top 30px;
background-size: 48px 48px;
}
.re-faq-patient-midashititle {
background: url("../images/faq/icon_patient.svg") no-repeat;
background-position: left 0 top 30px;
background-size: 48px 48px;
}
.re-faq-other-midashititle {
background: url("../images/faq/icon_other.svg") no-repeat;
background-position: left 0 top 30px;
background-size: 48px 48px;
}
.re-faq-sponsor-midashititle:before,
.re-faq-researcher-midashititle:before,
.re-faq-patient-midashititle:before,
.re-faq-other-midashititle:before {
  position: absolute;
  top: -1px;
  left: 0;
  width: 96px;
  height: 4px;
  content: '';
}
.re-faq-sponsor-midashititle:before {
  background: #30A693;
}
.re-faq-researcher-midashititle:before{
  background: #FF667E;
}
.re-faq-patient-midashititle:before {
  background: #00B5DA;
}
.re-faq-other-midashititle:before {
  background: #FF9938;
}


.re-faq-sponsor-subtitle,
.re-faq-researcher-subtitle,
.re-faq-patient-subtitle,
.re-faq-other-subtitle {
  font-size: 28px;
  line-height: 1;
  font-weight: 400;
  margin: 0 0 40px 0;
  padding: 0 0 0 20px;
  position: relative;
}
.re-faq-sponsor-subtitle {
  border-left: 4px solid #30A693;
}
.re-faq-researcher-subtitle {
  border-left: 4px solid #FF667E;
}
.re-faq-patient-subtitle {
  border-left: 4px solid #00B5DA;
}
.re-faq-other-subtitle {
  border-left: 4px solid #FF9938;
}


.re-faq-openbox64{
margin: 0 0 64px 0;
}
.re-faq-openbox100{
margin: 0 0 100px 0;
}
.re-faq-openbox48{
margin: 0 0 100px 0;
}
.re-faq-openbox64 p,
.re-faq-openbox100 p,
.re-faq-openbox48 p{
font-size: 16px;
margin: 0 0 20px 0;
padding: 0;
}


/* アコーディオン */
.re-faq-open-sponsor,
.re-faq-open-researcher,
.re-faq-open-patient,
.re-faq-open-other{
position: relative;
cursor: pointer;
cursor: hand;
border: 1px solid #D9D9D9;
padding: 16px 33px 16px 62px;
border-radius: 10px;
font-size: 18px;
margin: 0 0 20px 0;
font-weight: 400;
}
.re-faq-open-sponsor{
background: url("../images/faq/sponsor_q.svg") no-repeat;
background-position: left 20px top 15px;
background-size: 32px 32px;
background-color: #F8F8F8;
}
.re-faq-open-researcher{
background: url("../images/faq/researcher_q.svg") no-repeat;
background-position: left 20px top 15px;
background-size: 32px 32px;
background-color: #F8F8F8;
}
.re-faq-open-patient{
background: url("../images/faq/patient_q.svg") no-repeat;
background-position: left 20px top 15px;
background-size: 32px 32px;
background-color: #F8F8F8;
}
.re-faq-open-other{
background: url("../images/faq/other_q.svg") no-repeat;
background-position: left 20px top 15px;
background-size: 32px 32px;
background-color: #F8F8F8;
}

.re-faq-open-sponsor::before,
.re-faq-open-researcher::before,
.re-faq-open-patient::before,
.re-faq-open-other::before{/* 閉じている時 */
position: absolute;
right: 17px;
top: 50%;
transform : translateY(-50%);
content:"";
display:inline-block;
width:18px;
height:18px;
background-size:contain;
}
.re-faq-open-sponsor::before{/* 閉じている時 */
background:url("../images/faq/sponsor_plus.svg") no-repeat;
}
.re-faq-open-researcher::before{/* 閉じている時 */
background:url("../images/faq/researcher_plus.svg") no-repeat;
}
.re-faq-open-patient::before{/* 閉じている時 */
background:url("../images/faq/patient_plus.svg") no-repeat;
}
.re-faq-open-other::before{/* 閉じている時 */
background:url("../images/faq/other_plus.svg") no-repeat;
}

.re-faq-open-sponsor.active::before{/* 開いている時 */
background:url("../images/faq/sponsor_minus.svg") no-repeat;
}
.re-faq-open-researcher.active::before{/* 開いている時 */
background:url("../images/faq/researcher_minus.svg") no-repeat;
}
.re-faq-open-patient.active::before{/* 開いている時 */
background:url("../images/faq/patient_minus.svg") no-repeat;
}
.re-faq-open-other.active::before{/* 開いている時 */
background:url("../images/faq/other_minus.svg") no-repeat;
}

.re-faq-open-sponsor.active,
.re-faq-open-researcher.active,
.re-faq-open-patient.active,
.re-faq-open-other.active{/* 開いている時 */
border-radius: 10px 10px 0 0;
border-bottom: none;
margin: 0;
}

/* アコーディオンの詳細 */
.re-faq-content-sponsor,
.re-faq-content-researcher,
.re-faq-content-patient,
.re-faq-content-other {
display: none;
padding: 16px 20px 16px 62px;
margin: 0;
background-color: #fff;
border: 1px solid #D9D9D9;
border-top: none;
border-radius: 0 0 10px 10px;
margin: 0 0 20px 0;
position: relative;
}
.re-faq-content-sponsor{
background: url("../images/faq/sponsor_a.svg") no-repeat;
background-position: left 20px top 23px;
background-size: 32px 32px;
}
.re-faq-content-researcher{
background: url("../images/faq/researcher_a.svg") no-repeat;
background-position: left 20px top 23px;
background-size: 32px 32px;
}
.re-faq-content-patient{
background: url("../images/faq/patient_a.svg") no-repeat;
background-position: left 20px top 23px;
background-size: 32px 32px;
}
.re-faq-content-other{
background: url("../images/faq/other_a.svg") no-repeat;
background-position: left 20px top 23px;
background-size: 32px 32px;
}

.re-faq-content-sponsor p,
.re-faq-content-researcher p,
.re-faq-content-patient p,
.re-faq-content-other p{
font-size: 16px;
line-height: 1.8;
}
.re-faq-content-sponsor p a,
.re-faq-content-researcher p a,
.re-faq-content-patient p a,
.re-faq-content-other p a{
color: #006EBC;
text-decoration: underline;
}
.re-faq-content-sponsor p a:hover{
color: #30A693;
text-decoration: none;
}
.re-faq-content-researcher p a:hover{
color: #FF667E;
text-decoration: none;
}
.re-faq-content-patient p a:hover{
color: #00B5DA;
text-decoration: none;
}
.re-faq-content-other p a:hover{
color: #FF9938;
text-decoration: none;
}


/* 外部リンク */	
.otherlink-sponsor a,
.otherlink-researcher a,
.otherlink-patient a,
.otherlink-other a{
font-size: 16px;
margin: 0;
padding-right: 10px;
text-decoration: underline;
}
.otherlink-sponsor a{
color: #006EBC;
}
.otherlink-researcher a{
color: #FF667E;
}
.otherlink-patient a{
color: #00B5DA;
}
.otherlink-other a{
color: #FF9938;
}
.otherlink-sponsor a::after,
.otherlink-researcher a::after,
.otherlink-patient a::after,
.otherlink-other a::after {
position:relative;
top: 1px;
left: 5px;
content:"";
display:inline-block;
width: 16px;
height: 16px;
background-size:contain;
}
.otherlink-sponsor a::after {
background:url("../images/faq/icon_sponsor_link.svg") no-repeat;
}
.otherlink-researcher a::after {
background:url("../images/faq/icon_researcher_link.svg") no-repeat;
}
.otherlink-patient a::after {
background:url("../images/faq/icon_patient_link.svg") no-repeat;
}
.otherlink-other a::after {
background:url("../images/faq/icon_other_link.svg") no-repeat;
}
.otherlink-sponsor a:hover{
color: #30A693;
text-decoration: none;
}
.otherlink-researcher a:hover{
color: #FF667E;
text-decoration: none;
}
.otherlink-patient a:hover{
color: #00B5DA;
text-decoration: none;
}
.otherlink-other a:hover{
color: #FF9938;
text-decoration: none;
}


/* カテゴリートップへ戻るボタン */	
.re-category-top-btn{
padding: 0;
margin: 0 auto 100px auto;
width: 288px;
}
.re-category-top-btn a{
box-sizing: border-box;
display: block;
flex-wrap: wrap;
align-content: center;
height: 62px;
background-color: #fff;
font-size: 16px;
color: #222;
padding: 0 0 0 30px;
text-align: center;
border: 1px solid #D9D9D9;
border-radius: 10px;
background-size: 12px;
background-position: left 23px center;
background-image:url("../images/common/subnav_arrow_back.svg");
background-repeat: no-repeat;
line-height:1;
}
.re-category-top-btn a:hover{
color: #222;
opacity: 0.7;
}





/* ************************************************ 
*   レスポンシブ
* ************************************************ */
/* PC 画面の横幅が960px以上 */
@media only screen and (min-width: 960px){
.anchor {
display: block;
height: 0;
position: relative;
top: -100px;
}
}

/* Tablet (Portrait) 画面の横幅が768px〜959pxまで */
@media only screen and (min-width: 768px) and (max-width: 959px) {
.anchor {
display: block;
height: 0;
position: relative;
top: -100px;
}
.re-faq-navbtnbox-inner li.sponsor a,
.re-faq-navbtnbox-inner li.researcher a,
.re-faq-navbtnbox-inner li.patient a,
.re-faq-navbtnbox-inner li.other a{
font-size: 16px;
}

.re-faq-wrapper { width: 90%; }
.re-faq-sponsor-midashititle,
.re-faq-researcher-midashititle,
.re-faq-patient-midashititle,
.re-faq-other-midashititle {
font-size: 24px;
}
.re-faq-sponsor-subtitle,
.re-faq-researcher-subtitle,
.re-faq-patient-subtitle,
.re-faq-other-subtitle {
  font-size: 21px;
}

}

/* Mobile (Portrait) 画面の横幅が767pxまで */
@media only screen and (max-width: 767px) {
.anchor {
display: block;
height: 0;
position: relative;
top: -60px;
}
.re-faq-wrapper { width: 90%; }
.re-faq-navbtnbox {
margin: 0 auto;
}
.re-faq-navbtnbox-inner {
margin: 40px 0 0 0;
}
.re-faq-navbtnbox-inner li{
width: 50%;
margin: 0 0 20px 0;
}
.re-faq-navbtnbox-inner li.sponsor a,
.re-faq-navbtnbox-inner li.researcher a,
.re-faq-navbtnbox-inner li.patient a,
.re-faq-navbtnbox-inner li.other a{
font-size: 4.25vw;
padding: 50px 0 14px 0;
}

.re-faq-pagenavbox-sponsor,
.re-faq-pagenavbox-researcher,
.re-faq-pagenavbox-patient,
.re-faq-pagenavbox-other {
padding: 20px 12px 0 12px;
margin: 0 0 48px 0;
}
.re-faq-pagenavbox-sponsor ul,
.re-faq-pagenavbox-researcher ul,
.re-faq-pagenavbox-patient ul,
.re-faq-pagenavbox-other ul {
justify-content: space-between;
}

.re-faq-pagenavbox-sponsor li,
.re-faq-pagenavbox-researcher li,
.re-faq-pagenavbox-patient li,
.re-faq-pagenavbox-other li{
margin: 0 0 20px 0;
}
.re-faq-pagenavbox-sponsor li a,
.re-faq-pagenavbox-researcher li a,
.re-faq-pagenavbox-patient li a,
.re-faq-pagenavbox-other li a{
font-size: 3.75vw;
padding: 8px 11px 8px 9px;
}


.re-faq-searchbox {
margin: 0 auto 60px auto;
}

.re-faq-sponsor-midashititle,
.re-faq-researcher-midashititle,
.re-faq-patient-midashititle,
.re-faq-other-midashititle {
font-size: 6vw;
}
.re-faq-sponsor-midashititle:before,
.re-faq-researcher-midashititle:before,
.re-faq-patient-midashititle:before,
.re-faq-other-midashititle:before { width: 72px; }

.re-category-top-btn{
margin: 0 auto 60px auto;
width: 80%;
}
.re-faq-sponsor-subtitle {
font-size: 5.25vw;
margin: 0 0 28px 0;
}

#faq-search-text{
height: 56px;
margin: 0;
padding: 0 50px 0 32px;
background: url("../images/common/icon_search_bk.svg") no-repeat;
background-position: center right 20px;
background-size: 26px 26px;
font-size: 4.5vw;
}

.re-faq-openbox64{
margin: 0 0 48px 0;
}
.re-faq-openbox100{
margin: 0 0 60px 0;
}
.re-faq-openbox48{
margin: 28px 0 100px 0;
}
.re-faq-openbox64 p,
.re-faq-openbox100 p,
.re-faq-openbox48 p{
font-size: 4.25vw;
}


.re-faq-open-sponsor,
.re-faq-open-researcher,
.re-faq-open-patient,
.re-faq-open-other{
padding: 12px 35px 12px 57px;
font-size: 4.5vw;
margin: 0 0 20px 0;
background-position: left 16px top 15px;
background-size: 30px 30px;
}

.re-faq-open-sponsor::before,
.re-faq-open-researcher::before,
.re-faq-open-patient::before,
.re-faq-open-other::before{/* 閉じている時 */
right: 17px;
width:18px;
height:18px;
}

/* アコーディオンの詳細 */
.re-faq-content-sponsor,
.re-faq-content-researcher,
.re-faq-content-patient,
.re-faq-content-other {
padding: 12px 12px 12px 57px;
background-position: left 16px top 20px;
background-size: 30px 30px;
}

.re-faq-content-sponsor p,
.re-faq-content-researcher p,
.re-faq-content-patient p,
.re-faq-content-other p{
font-size: 4.25vw;
}




.re-category-top-btn a{
padding: 0 0 0 20px;
height: 52px;
font-size: 4.25vw;
}
.re-category-top-btn a:hover{
color: #222;
opacity: 0.7;
}

}