@charset "UTF-8";

/* 下層ページ共通部分
------------------------------- */

.contents {
    padding: 10px 20px 80px 20px;
    max-width: 1140px;
    margin: 0 auto;
}

.contents__link{
    font-size: 16px;
    margin-top: 15px;
    display: inline-block;
}

.section_box {
    padding-top: 30px;
}

.section_box p {
    font-size: 1.6rem;
    line-height: 1.7em;
    margin-top: 30px;
}

.detail_box {
    /* margin-top: 50px; */
    max-width: 640px;
    margin: 50px auto 0;
}

.section_box p a,
.detail_box a {
    color: #1DCB75;
    font-weight: bold;
    text-decoration: underline;
}

.section_box p a:hover,
.detail_box a:hover {
    text-decoration: none;
}

.section_box .str,
.detail_box .str,
.detail_box .imp {
    display: inline-block;
    font-weight: bold;
}

.detail_box .imp {
    color: #E03455;
}

.lower_img {
    width: 100%;
}

.lower_img img {
    width: 100%;
}

.lower_img figcaption {
    margin-top: 10px;
    font-size: 1.4rem;
    font-weight: bold;
}

/* 下層ページタイトル
------------------------------- */

.title_box {
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    /* background: url(../images/bg_title.png), linear-gradient( 135deg, rgba(89,185,167, 1), rgba(230,245,242, 1)); */
    /* background: url(../images/bg_title.png), linear-gradient( 135deg, rgba(29,203,117, 1), rgba(18,119,69, 1)); */
    background: url(../images/bg_title2.png), linear-gradient(135deg, rgba(29, 203, 117, 1), rgba(156, 232, 195, 1));
    background-size: 100%;
    background-position: 0 80%;
    padding: 40px 20px;
}

@media screen and (min-width:768px) {
    .title_box {
        padding: 60px 20px;
    }
}

.title_box--membership{
    background: url(../images/bg_membership_title2.png), linear-gradient(135deg, rgba(221, 102, 28, 1), rgba(237, 173, 53, 1));
    background-size: 100%;
    background-position: 0 80%;
}
.title_box--membership span{
    font-size: 3rem;
}

@media screen and (max-width: 767px){
    .title_box--membership span{
        font-size: 2rem;
        display: block;
        text-align: center;
    }
}


/* ページネーション
------------------------------- */

.pagination {
    display: flex;
    justify-content: center;
    margin-top: 55px;
}

.page-numbers li {
    display: inline;
    font-size: 1.8rem;
    font-family: brandon-grotesque, sans-serif;
    font-weight: 700;
    font-style: normal;
    vertical-align: middle;
}

.page-numbers li a {
    border: 1px solid #DDDDDD;
    text-align: center;
    text-decoration: none;
    min-width: 1em;
    transition: all .3s;
    padding: 0.1em 0.5em;
    margin: 0 0.2em;
}

span.page-numbers {
    text-align: center;
    text-decoration: none;
    min-width: 1em;
    transition: all .3s;
    padding: 0.1em 0.5em;
    margin: 0 0.2em;
}

span.current {
    border: 1px solid #1DCB75;
    color: #1DCB75;
    text-align: center;
    text-decoration: none;
    min-width: 1em;
    transition: all .3s;
    padding: 0.1em 0.5em;
    margin: 0 0.2em;
}





.next {
    border: 1px solid #1DCB75;
    background: #1DCB75;
    color: #ffffff;
}




/* HMW総合研究所について
------------------------------- */

.greeting_box .lower_img {
    width: 50%;
    margin: 0 auto;
    text-align: center;
}


.greeting_text p {
    margin-top: 30px;
    text-align: justify;
    text-justify: inter-ideograph;
}

.overview {
    font-size: 1.4rem;
    border-collapse: collapse;
    margin: 0 auto;
    margin-top: 30px;
    width: 100%;
}

.overview tr {
    border-top: 1px solid #CBCBCB;
}

.overview tr:last-child {
    border-bottom: 1px solid #CBCBCB;
}

.overview th,
.overview td {
    padding: 20px 10px;
}

.overview th {
    background: #DDF7EA;
    width: 6em;
    text-align: center;
}

.overview td {
    padding: auto 1em;
    line-height: 1.5em;
}


@media screen and (min-width:768px) {
    .greeting_box {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .greeting_box .lower_img {
        margin-top: 50px;
        margin: 50px 0 0;
        text-align: left;
        width: 18%;
        max-width: 500px;
        order: 2;
    }

    .lower_img figcaption {
        margin-top: 15px;
        margin-left: 1px;
        font-size: 1.6rem;
        font-weight: bold;
    }

    .greeting_box h2 {
        order: 1;
        width: 100%;
    }

    .greeting_text {
        padding-left: 30px;
        order: 3;
        width: 82%;
    }

    .greeting_text p:first-child {
        margin-top: 50px;
    }

    .overview {
        margin-top: 50px;
    }

    .overview th {
        width: 16em;
        text-align: left;
    }

}

@media screen and (min-width:1024px) {}

/* 事業内容
------------------------------- */

.business_list h2 {
    justify-content: flex-start;
    text-align: left;
}

.business_list li {
    margin-top: 60px;
}

/* .business_list li:first-child {
    margin-top: 60px;
} */

@media screen and (min-width:768px) {
    .business_list li {
        display: flex;
        margin-top: 80px;
    }

    .business_list .lower_img {
        width: 40%;
        height: fit-content;
    }

    .business_list h2 {
        font-size: 2.5rem;
        margin-top: 0;
    }

    .business_list_left img {
        padding-right: 30px;
    }

    .business_list_right h2 {
        order: 1;
    }

    .business_list_right p {
        order: 2;
    }

    .business_list_right img {
        padding-left: 30px;
        order: 3;
    }

}

@media screen and (min-width:1024px) {}




/* 事業内容
------------------------------- */

/* .business_list li {
    margin-top: 60px;
} */

.business_list li:first-child {
    margin-top: 20px;
}

@media screen and (min-width:768px) {
    /* .business_list li {
        display: flex;
    }*/

    .business_list li:first-child {
        margin-top: 60px;
    }

    .business_list .lower_img {
        width: 40%;
        height: fit-content;
    }

    .business_list h2 {
        font-size: 2.5rem;
        margin-top: 0;
    }

    .business_list_left img {
        padding-right: 30px;
    }

    .business_list_right h2 {
        order: 1;
    }

    .business_list_right p {
        order: 2;
    }

    .business_list_right img {
        padding-left: 30px;
        order: 3;
    }

}

@media screen and (min-width:1024px) {}



/* ニュース
------------------------------- */

.news_list li {
    position: relative;
    list-style-type: none;
    padding: 20px 20px 20px 0;
    border-bottom: 1px solid #DDDDDD;
}

.news_list li a:hover {
    color: #1DCB75;
}

.news_list li a::after {
    content: '\f105';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    top: 45%;
    right: 0px;
    color: #1DCB75;
    font-size: 1.8rem;
}

.news_list li dl dt {
    font-family: din-2014, sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 1.4rem;
    text-align: left;
    margin-bottom: 20px;
}

.news_list li dl dt .category_news,
.news_list li dl dt .category_ra {
    font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", sans-serif;
    font-size: 1.2rem;
    color: #ffffff;
    padding: 8px 10px;
    margin-right: 10px;
}

.news_list li dl dt .category_news {
    background: #EDAD35;
}

.news_list li dl dt .category_ra {
    background: #1DCB75;
}

.news_list li dl dd {
    font-size: 1.4rem;
    text-align: left;
    line-height: 1.7em;
}


@media screen and (min-width:768px) {

    .news_list li a::after {
        top: 32%;
    }
    
    .news_list dl {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        width: 100%;
    }

    .news_list li dl dt {
        width: 20%;
        margin-bottom: 0;
        /* display: flex;
        align-items: center; */
    }

    .news_list li dl dd {
        width: 75%;
        margin-top: 0;
        /* display: flex;
        align-items: center; */
    }
}

@media screen and (min-width:1024px) {
    .news_list li dl dt {
        width: 20%;
    }

    .news_list li dl dd {
        width: 80%;
    }
}


/* ニュース詳細
------------------------------- */

.title_box {
    position: relative;
}

.title_box .data {
    position: absolute;
    bottom: 10px;
    right: 10px;
    font-family: din-2014, sans-serif;
    font-style: normal;
    font-size: 1.4rem;
    color: #FFFFFF;
}

.news_img {
    width: 100%;
}

.detail_box p {
    font-size: 1.6rem;
    line-height: 1.7em;
    margin-top: 30px;
}

h3 {
    padding: 0.25em 0.5em;
    background: transparent;
    border-left: solid 5px #1DCB75;
    font-size: 2.0rem;
    margin-top: 30px;
    font-weight: bold;
}

.membership h3{
    font-size: 2.8rem;
}

h4 {
    background: transparent;
    border-left: solid 5px #00ADC3;
    ;
    font-size: 1.8rem;
    margin-top: 30px;
    font-weight: bold;
}

@media screen and (max-width: 767px){
    .membership h3{
        font-size: 2rem;
    }
}


/* membership - セミナー一覧
------------------------------- */
.seminar_list{
    display: flex;
    gap: 40px 50px;
    flex-wrap: wrap;
}

.seminar_list li{
    width: calc(100% / 3 - 35px);
}

.seminar_list li img{
    height: 220px;
    width: 100%;
    object-fit: contain;
}

.seminar_info{
    padding-top: 10px;
}

.seminar_info p:not(:first-child){
    margin-top: 15px;
}
.seminar_info .cat{
    color: #1DCB75;
    font-size: 1.2rem;
    background-color: #E6F5F2;
    border-radius: 30px;
    padding: 6px 14px;
    display: inline-block;
}

.seminar_info .ttl{
    font-size: 1.8rem;
    font-weight: bold;
    position: relative;
    padding-right: 10px;
}

.seminar_info .ttl:after{
    content: '\f105';
    font-family: 'Font Awesome 6 Free';
    position: absolute;
    right: 0;
    color: #1DCB75;
    top: 50%;
    transform: translateY(-50%);
}

.seminar_info .date{
    font-size: 1.2rem;
    font-family: din-2014, sans-serif;
}

.seminar_cat{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px 50px;
    background-color: #F3F3F3;
    padding: 30px;
}

.seminar_cat .catTtl{
    font-size: 1.8rem;
    padding-right: 10px;
    border-right: 2px solid #1DCB75;
    font-weight: bold;
}

.seminar_cat ul{
    display: flex;
    flex-wrap: wrap;
    gap: 14px 10px;
    font-size: 1.2rem;
}

.seminar_cat ul a{
    background-color: #fff;
    border: 1px solid #1DCB75;
    border-radius: 20px;
    padding: 8px 20px;
    display: inline-block;
    transition: .3s all;
}

.seminar_cat ul a:hover{
    color: #fff;
    background-color: #1DCB75;
}

.seminar_cat ul a.is-active{
    color: #fff;
    background-color: #1DCB75;
    font-weight: bold;
}

.wp-block-file{
    text-align: center;
}

@media screen and (max-width: 767px){
    .seminar_list{
        flex-direction: column;
    }

    .seminar_list li{
        width: 100%;
    }

    .seminar_cat{
        flex-direction: column;
        padding: 24px 20px;
    }
    
    .seminar_cat .catTtl{
        border-right: none;
        padding-right: 0;
        border-bottom: 2px solid #1DCB75;
        width: 100%;
        text-align: center;
        padding-bottom: 16px;
    }

    .seminar_cat ul a{
        padding: 8px 16px;
    }

    .seminar_info .ttl{
        font-size: 1.6rem;
    }

    .seminar_info p:not(:first-child){
        margin-top: 10px;
    }

}



/* 研究業績
------------------------------- */

.research_wrap+.research_wrap {
    margin: 80px 0 0;
}

.ra_list {
    margin-top: 20px;
}

.ra_list li {
    position: relative;
    list-style-type: none;
    padding: 20px 20px 20px 0;
    border-bottom: 1px solid #DDDDDD;
}

.ra_list li a:hover {
    color: #1DCB75;
}


.ra_list li a::after {
    content: '\f08e';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    top: 45%;
    right: 0px;
    color: #1DCB75;
    font-size: 1.8rem;
}

.ra_list li dl dt {
    font-family: din-2014, sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 1.4rem;
    text-align: left;
    margin-bottom: 20px;
}

.ra_list li dl dt .category_news,
.ra_list li dl dt .category_ra {
    font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", sans-serif;
    font-size: 1.2rem;
    color: #ffffff;
    padding: 8px 10px;
    margin-right: 10px;
}

.ra_list li dl dt .category_news {
    background: #EDAD35;
}

.ra_list li dl dt .category_ra {
    background: #1DCB75;
}

.ra_list li dl dd,
.ra_list li dl dd p {
    font-size: 1.4rem;
    text-align: left;
    line-height: 1.7em;
    margin-top: 0;
}

.ra_list_btn_wrap {
    text-align: center;
    margin-top: 50px;
}


@media screen and (min-width:768px) {

    .ra_list li a::after {
        top: 32%;
    }

    .ra_list dl {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        width: 100%;
    }

    .ra_list li dl dt {
        width: 20%;
        margin-bottom: 0;
        /* display: flex;
        align-items: center; */
    }

    .ra_list li dl dd {
        width: 75%;
        margin-top: 0;
        /* display: flex;
        align-items: center; */
    }
}

@media screen and (min-width:1024px) {
    .ra_list li dl dt {
        width: 20%;
    }

    .ra_list li dl dd {
        width: 80%;
    }
}

/* membership - アンカーリンク
------------------------------- */
.membership_anchor{
    background-color: #F3F3F3;
    padding: 20px;
}

.membership_anchor ul{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 50px;
}

.membership_anchor ul li{
    position: relative;
}

.membership_anchor ul li:not(:first-child):before{
    content: '';
    position: absolute;
    display: inline-block;
    width: 1px;
    height: 14px;
    background-color: #CBCBCB;
    top: 50%;
    transform: translateY(-50%);
    left: -25px;
}

.membership_anchor ul a{
    font-size: 1.4rem;
    font-weight: bold;
    position: relative;
    padding-right: 18px;
    display: inline-block;
}

.membership_anchor ul a:after{
    content: '\f078';
    font-family: 'Font Awesome 6 Free';
    position: absolute;
    right: 0;
    color: #1DCB75;
    top: 50%;
    transform: translateY(-50%);
}

@media screen and (max-width: 767px){
    .membership_anchor ul{
        flex-direction: column;
    }

    .membership_anchor ul a{
        display: block;
    }

    .membership_anchor ul li{
        width: 100%;
    }

    .membership_anchor ul li:not(:first-child):before{
        width: 100%;
        height: 1px;
        top: -25px;
        transform: translateX(-50%);
        left: 50%;
    }
}

/* membership - 先行研究文献について（文献複写のご案内）
------------------------------- */
#literature02,#ethics02{
padding-top: 100px;
margin-top: -100px;
}

.literature{
    padding: 20px 0 150px;
    font-size: 1.6rem;
    line-height: 1.7em;
}

.literature .note{
    font-size: 1.2rem;
    padding-top: 20px;
    line-height: 1.7em;
    padding-left:1em;
    text-indent:-1em;
}

.literature .attention{
    position: relative;
    padding-left: 38px;
    margin-top: 40px;
}

.literature .attention:before{
    content: '';
    position: absolute;
    display: inline-block;
    background: url('../images/ic-attention.svg') no-repeat;
    background-size: contain;
    width: 28px;
    height: 28px;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.literature__main{
    display: flex;
    padding-top: 50px;
}

.literature__main b{
    font-size: 2.8rem;
    line-height: 150%;
}

.literature__main .txt{
    flex: 0 0 57%;
}

.literature__main .img{
    padding-left: 40px;
}

.literature__main img{
    width: 43%;
    object-fit: contain;
    position: absolute;
    right: 0;
}

.literature__txt{
    padding-top: 120px;
    font-size: 1.8rem;
    text-align: center;
    line-height: 1.7em;
}

.literature__txt b{
    font-size: 2rem;
}

.literature__method{
    padding-top: 90px;
}

.methodInner{
    margin-top: -30px;
    display: flex;
    gap: 0 40px;
}

.methodInner__inner{
    padding-top: 70px;
}

.membership h4{
    padding-left: 50px;
    border-left: none;
    position: relative;
    margin-top: 0;
}

.membership h4:before{
    content: "";
    display: inline-block;
    position: absolute;
    width: 40px;
    height: 4px;
    background-color: #1DCB75;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}

.methodInner__inner ul,.methodInner__inner p{
    padding-top: 30px;
}

.methodInner__inner li{
    padding-left:1em;
    text-indent:-1em;
}

.methodInner__inner li:before{
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #1DCB75;
    margin-right: 5px;
    transform: translateY(-50%);
}

.methodInner__inner li b,.methodInner__inner p b{
    font-size: 1.8rem;
}

.methodInner__inner li a{
    color: #1DCB75;
    font-weight: bold;
    text-decoration: underline;
}

.methodInner__inner .button{
    padding-top: 30px;
}

.methodInner .methodInner__inner{
    width: calc(100% / 2 - 20px);
}

.gray_box{
    margin: 50px 65px 0;
    background-color: #F3F3F3;
    padding: 50px;
}

.gray_box h4{
    margin-left: -50px;
}

.gray_box p{
    padding-top: 34px;
}

.gray_box ul{
    padding-top: 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px 30px;
}

.gray_box .link{
    font-weight: bold;
    text-decoration: underline;
    color: #1DCB75;
}

.gray_box .num{
    counter-reset: my-counter;
}

.gray_box .num li{
    width: calc(100% / 3 - 20px);
}

.gray_box .num li:before{
    content: counter(my-counter) ".";
    counter-increment: my-counter;
    font-weight: bold;
    margin-right: 10px;
}

.gray_box .button_arrow{
    padding-top: 20px;
}

@media screen and (max-width: 767px){
    #literature02,#ethics02{
        padding-top: 30px;
        margin-top: -30px;
    }

    .membership h4{
        padding-left: 20px;
    }

    .membership h4:before{
        width: 10px;
        left: 0;
        top: 10px;
    }

    .literature{
        padding: 20px 0 50px;
    }

    .literature .attention:before{
        top: 0;
        transform: initial;
    }

    .literature__main{
        flex-direction: column;
        padding-top: 30px;
    }

    .literature__main b{
        font-size: 2rem;
    }

    .literature__main .img{
        padding-left: 0;
        padding-top: 30px;
        margin-right: -20px;
    }

    .literature__main img{
        position: initial;
        width: 100%;
    }

    .literature__txt{
        padding-top: 80px;
    }

    .literature__method{
        padding-top: 50px;
    }

    .methodInner{
        flex-direction: column;
    }

    .methodInner .methodInner__inner{
        width: 100%;
    }
    
    .gray_box{
        margin: 50px 0 0;
        padding: 30px 20px;
    }

    .gray_box h4{
        margin-left: -20px;
    }

    .gray_box p{
        padding-top: 20px;
    }

    .gray_box ul{
        flex-direction: column;
    }

    .gray_box .num li{
        width: 100%;
    }
}

/* membership - 倫理審査について
------------------------------- */
.gray_box.ethics .img{
   padding-top: 40px;
}

.gray_box.ethics img{
    width: 100%;
}

.gray_box.ethics .button{
    padding-top: 20px;
}

.ethics__inner{
    padding-top: 90px;
}

.ethics__inner .inner{
    padding-top: 30px;
}

.ethics__inner li{
    padding-left:1em;
    text-indent:-1em;
}

.ethics__inner li:before{
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #1DCB75;
    margin-right: 5px;
    transform: translateY(-50%);
}

.ethics__inner .btnArea{
    display: flex;
    align-items: center;
    gap: 20px 40px;
    flex-wrap: wrap;
    padding-top: 30px;
}

.ethics__inner .btnInner{
    display: flex;
    align-items: center;
    gap: 10px;
}

.ethics__inner .btnInner .button_arrow a{
    font-size: 1.4rem;
}

@media screen and (max-width: 767px){
    .ethics__inner{
        padding-top: 50px;
    }

    .gray_box.ethics .imgArea{
        overflow: hidden;
        width: 100%;
    }

    .gray_box.ethics .img{
        overflow: scroll;
    }

    .gray_box.ethics img{
        height: 260px;
        width: auto;
    }
}