@charset "UTF-8";
/* CSS Document */

/*---------------------
共通項目
---------------------*/
html {
    font-size: 62.5%;
}
body {
    letter-spacing: 0.05em;
    font-feature-settings: "palt";
    font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
    font-size: 1.4rem;
	line-height: 1.8;
    font-weight: 400;
    font-style: normal;
    background: #FCFCFC;
	color: #1A1A1A;
    -webkit-appearance: none;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scroll-behavior: smooth;
    -webkit-backface-visibility: hidden;
    max-width: 1920px;
    margin: 0 auto;
}
p{
/*    font-weight: 300;*/
}
small{
    font-size: 1.2rem;
}
ul{
	list-style: none;
}
a{
	transition: .4s;
    display: inline-block;
}
a:hover{
    opacity: .6;
}
iframe{
    max-width: 100%;
    height: auto;
}
h1,h2,h3,h4,h5{
    line-height: 1.2;
    font-weight: 600;
}
div{
    box-sizing: border-box;
}
#page_top a{
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: #F49702;;
    border: 2px solid #fff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    z-index: 1000;
    line-height: 50px;
    font-weight: bold;
    text-align: center;
    box-shadow: 0px 0px 15px -5px rgba(41,42,44,0.6);
    opacity: 0.7;
    color: #fff;
/*    padding-top: 10px;*/
}
#page_top a:hover{
    opacity: 1;
}

.content{
    overflow: hidden;
}
.wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}
.hide{
	display: none;
}
.open{
	display: block;
}
.block {
    padding: 80px 0;
}
.block-bottom{
    padding-bottom: 80px;
}
.sponly {
    display: none;
}
.center {
    text-align: center;
}
.bold{
	font-weight: bold;
}
.flex{
	display: flex;
	justify-content: space-between;
}


/*---------------------
タイトル装飾
---------------------*/
/*ページタイトル*/
 .page-head{
     padding: 160px 0;
 }
.medical-main .page-head{
    background:url("../images/common/header-medical_pc-min.jpg") no-repeat;
    background-size: cover;
    background-position: center;
}
.legal-main .page-head{
    background:url("../images/common/header-legal_pc-min.jpg") no-repeat;
    background-size: cover;
    background-position: center;
}
.political-main .page-head{
    background:url("../images/common/header-political_pc-min.jpg") no-repeat;
    background-size: cover;
    background-position: center;
}
.allvoices-main .page-head,
.othercommunities-main .page-head,
.schoolcommunity-main .page-head,
.workplacecommunity-main .page-head{
    background:url("../images/common/header-allvoices-min.jpg") no-repeat;
    background-size: cover;
    background-position: center;
}
.contact-main .page-head{
    background:url("../images/common/header-contact_pc-min.jpg") no-repeat;
    background-size: cover;
    background-position: center;
}
.news-main .page-head,
.post-main .page-head{
    background:url("../images/common/header-news_pc-min.jpg") no-repeat;
    background-size: cover;
    background-position: center;
}
.movie-main .page-head{
    background:url("../images/common/header-movie_pc.jpg") no-repeat;
    background-size: cover;
    background-position: center;
}
.page-ttl{
    font-style: normal;
    font-size: 4rem;
    text-align: center;
    font-family: dnp-shuei-mgothic-std, sans-serif;
}

/*セクションのタイトル*/
.sec-ttl{
    font-style: normal;
    font-size: 3rem;
    text-align: center;
    margin-bottom: 40px;
    position: relative;
    color: #F49702;
    padding-bottom: 30px; 
    font-family: dnp-shuei-mgothic-std, sans-serif;
}
.sec-ttl::before{
    content: "";
    position: absolute;
    width: 8%;
    margin: auto;
    right: 0;
    left: 0;
    bottom: 0;
    background: #F49702;
    height: 2px;
    border-radius: 10px;
}

/*メディカル救済*/
#obi{
    background-color: #FF8D27;
    padding: 5px 0;
}
#obi p{
    text-align: center;
    color: #fff;
    font-size: 1.8rem;
    font-weight: 700;
}
/*
#obi p::before {
	content: "＼";
	color: #fff;
	font-size: 129%;
}
#obi p::after {
	content: "/";
	color: #fff;
	font-size: 129%;
}
*/
#medical-content .item.blue h3{
    background: #73C6C8;
}
#medical-content .item.blue{
    border: solid 3px #73C6C8;
}
#medical-content .sub-ttl{
    background: #FCCA8C;
    padding: 15px;
    border-radius: 10px;
    font-size: 2rem;
    margin-bottom: 15px;
    font-weight: 500;
}
#medical-content .inner .txt{
    margin-bottom: 40px;
}
#medical-content .inner .txt p{
    line-height: 2;
    margin: 0 15px;
}

#medical-content .inner .txt .img{
    margin:30px 160px 30px;
}
#medical-content .inner .caption{
    text-align: center;
    font-size: 1.8rem;
    font-weight: 500;
}
/*ポリティカル救済*/

#ade .item.blue h3{
    background: #73C6C8;
}
#ade .item.blue{
    border: solid 3px #73C6C8;
}
#ade .sub-ttl{
    background: #FCCA8C;
    padding: 15px;
    border-radius: 10px;
    font-size: 2rem;
    margin-bottom: 15px;
    font-weight: 500;
}
#ade .inner .txt{
    margin-bottom: 40px;
}
#ade .inner .txt p{
    line-height: 2;
    margin: 0 15px;
}

#ade .inner .txt .img{
    margin:30px 160px 30px;
}
#ade .inner .caption{
    text-align: center;
    font-size: 1.8rem;
    font-weight: 500;
}

/*ポリティカル救済*/

.block .item.blue h3{
    background: #73C6C8;
}
.block .item.blue{
    border: solid 3px #73C6C8;
}
.block.sub-ttl{
    background: #FCCA8C;
    padding: 15px;
    border-radius: 10px;
    font-size: 2rem;
    margin-bottom: 15px;
    font-weight: 500;
}
.block .inner .txt{
    margin-bottom: 40px;
}
.block .inner .txt p{
    line-height: 2;
    margin: 0 15px;
}

.block .inner .txt .img{
    margin:30px 160px 30px;
}
.block .inner .caption{
    text-align: center;
    font-size: 1.8rem;
    font-weight: 500;
}
/*---------------------
ボタン
---------------------*/
.btnarea{
    text-align: center;
    margin-top: 40px;
}
.btnarea .btn,
.btnarea input[type="submit"]{
    display: inline-block;
    text-align: center;
    transition: .4s;
    padding: 15px;
    width: 30%;
    background: #F49702;
    border: solid 1px #fff;
    font-size: 2.2rem;
    box-sizing: border-box;
    color: #fff;
}
.btnarea .btn:hover,
.btnarea input[type="submit"]:hover{
    background: #fff;
    color: #F49702;
    border: solid 1px #F49702;
}
.btnarea .btn.orage{
    background: #fff;
    border: solid 1px #F49702;
    color: #F49702;;
}
.btnarea .btn.orage:hover{
    background: #F49702;
    color: #fff;;
}


/*---------------------
header
---------------------*/
header{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
header .pconly{
}
.site-title a{
    display: block;
    padding-left: 15px;
}
.telbtn{
    background: #73C6C8;
}
.telbtn,
.mailbtn{
    display: flex;
    align-items: center; 
        justify-content: center;
    min-width: 165px;
    color: #fff;
}
.telbtn img,
.mailbtn img{
    padding-right: 5px;
    width: 25px;
}
.mailbtn{
    background: #F49702;
}
header nav ul{
    display: flex;
    justify-content: flex-end;

}
header nav ul li{
    text-align: center;
    box-sizing: border-box;
}
header nav ul li a{
    padding: 15px 15px;
    width: 100%;
    display: inline-block;
    position: relative;
    font-size: 1.6rem;
    box-sizing: border-box;
}
header nav ul li a:hover{
    opacity: 0.6;
    text-decoration: underline;
}

/*---------------------
footer
---------------------*/
footer {
    background: #F49702;
    padding: 60px 0 10px;
    color: #fff;
}
footer .inner ul{
    display: flex;
    align-items: center;
    margin-bottom: 60px;
    justify-content: center;
}
footer .inner ul li{
    font-size: 1.6rem;
    margin: 0 16px;
}
.footer-logo{
    text-align: center;
    margin: 0 auto 40px;
    -webkit-backface-visibility: hidden;
}
footer .inner ul li a:hover{
    text-decoration: underline;
}
footer small{
    text-align: center;
    display: block;
}
/*トップページ以外に設置してあるformのスタイル*/
#footer-form{
    background:url("../images/common/header-footer-form-min.jpg") no-repeat;
    background-size: cover;
    background-position: center;
}
#footer-form .footer-ttl{
    display: block;
    margin: 0 auto;
}
#footer-form .btnarea img{
    position: relative;
    margin-bottom: -27px;
    z-index: 10;
}
#footer-form .btnarea .btn.form{
    width: 80%;
    border-radius: 20px;
    padding: 30px 15px;
}
#footer-form .sponly{
    display: none
}
/*---------------------
パンクズリスト
---------------------*/
.breadcrumb {
    padding: 5px 0;
    font-size: 1.2rem;
    color: #7B7B7B;
}
.breadcrumb a:hover {
    opacity: 0.8;
    text-decoration: underline;
}

/*---------------------
リーガル救済
---------------------*/
.legal-main .page-head .under-head .page-ttl-area .page-ttl{
    color: #fff;
}
.qa-box{
    border: solid 3px #F49702;
    border-radius: 3px;
    padding: 30px;
}
.qa-content .qa-box:not(:first-child){
    margin-top: 30px;
}
.qa-content .qa-box:first-child{
    margin-top: 40px;
}
.qa-box h3{
    font-size: 2.5rem;
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: solid 2px #FFCD7C;
}
.qa-box h3:before{
    content: "Q";
	color: #F49702;
    font-size: 120%;
    padding-right: 20px;
}
.qa-content .a-area p:not(:last-child){
    padding-bottom: 20px;
}
.qa-content a{
    color: #F49702;
    text-decoration: underline;
    word-break: break-all;
}
/*---------------------
ポリティカル救済
---------------------*/
.political-main #ade .img img{border: 1px solid #000;}
.political-main #ade .more{
    display: block;
    margin: 15px auto;
    text-align: center;
    font-size: 18px;
    color: #F49702;
}
#political-content video{
    width: 100%;
}
.political-main #popup{
    display:none;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 100;
    width: 100%;
    height: 100vh;
}
.political-main .popup-wrap{
    position: absolute;
    width: auto;
    height: 80%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    overflow-y: scroll;
}
.political-main .popup-wrap .closeBtn{
    font-size: 36px;
    font-weight: bold;
    line-height: 1;
    width: fit-content;
    width: -moz-fit-content;
    position: absolute;
    right: 0;
    top: 0;
}
@media screen and (max-width:768px) {
    .political-main .popup-wrap{
        width: 80%;
    }
}
@media screen and (max-width:479px){
    .political-main .popup-wrap{
        width: 90%;
        height: 65%;
    }
}

/*---------------------
声なき声を集めて可視化⇒国政へ
---------------------*/
.linkAllVoices{
    margin: 15px auto;
    display: block;
    text-align: center;
    font-size: 3rem;
}
.allvoices-main .page-head .under-head .page-ttl-area .page-ttl{
    color: #fff;
}
#allvoices-content .catInner{
    border: 2px solid #F49702;
    padding: 20px 10px;
    text-align: center;
    margin-bottom: 30px;
}
#allvoices-content .catInner + p{margin-bottom: 20px}
#allvoices-content .catInner ul{
    display: flex;
    align-items: center;
    justify-content: center;
}
#allvoices-content .catInner li{
    background-color: #F49702;
    color: #fff;
    padding: 4px 10px;
    border-radius: 8px;
    margin: 0 2%;
}
#allvoices-content .list-wrap .update{text-align: right;}
#allvoices-content .list-wrap li{
    border: 1px solid #ddd;
    margin: 15px auto;
    padding: 15px;
}
#allvoices-content .list-wrap li .catName,
#allvoices-content .list-wrap li .readmore{
    color: #F49702;
    text-align: right;
}
#allvoices-content .list-wrap li .popup{
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(50, 50, 50, 0.5);
    z-index: 20;
}
#allvoices-content .list-wrap li .popup .inner{
    background-color: #fff;
    width: 50%;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 50px 30px 30px;
    max-height: 80vh;
    overflow-y: auto;
}
#allvoices-content .list-wrap li .popup .btnClose{
    position: absolute;
    right: 8px;
    top: 8px;
    margin: 0;
    width: 40px;
    height: auto;
    object-fit: contain;
}


/*---------------------
新着情報
---------------------*/
#blog{
    background: #FCCE84;
}
#blog .sec-ttl{
    color: #fff;
}
#blog .sec-ttl::before{
    background: #fff;
}
#blog .inner{
    justify-content: flex-start;
	flex-wrap:wrap;
}
#blog .item{
    width: 32%;
    margin-right: 2%;
	margin-bottom:60px;
}
#blog .item:nth-child(3n){
    margin-right: 0;
}
#blog .item a{
    width: 100%;
    padding: 30px;
    border-radius: 20px;
    background: #fff;
    box-sizing: border-box;
    position: relative;
    display: block;
	height:100%;
}
#blog .item a .catname{
    position: absolute;
    top: 40px;
    left: -10px;
    background:#F49702;
    color: #fff;
    padding: 2px 10px;
    font-size: 1.6rem;
}
#blog .day{
    color: #F49702;
    margin: 10px 0 5px;
    font-size: 1.6rem;
    font-weight: 500;
}
#blog h3{
    font-size: 2rem;
    margin-bottom: 10px;
}
#blog p{
    font-size: 1.5rem;
	text-align:left;
}
/*新着投稿動画部分*/
#blog .movie-area .item{
    width: 48%;
}
#blog .movie-area .item a{
    padding: 0;
    background: transparent;
}
/*タブ切り替え*/
.movie-area video{
    width: 100%;
}
.tab-area {
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  border-bottom: solid 3px #fff;
}
.tab-area .tab {
    width: 47%;
    text-align: center;
    color: white;
    font-size: 2.8rem;
    border: solid 3px #fff;
    border-bottom: none;
    font-family: dnp-shuei-mgothic-std, sans-serif;
    padding: 10px 0;
  }
.tab-area .tab.active {
    background-color:#F49702;
    color: #fff;
    border: none;
    border: solid 3px #fff;
    border-bottom: none;
    padding: 10px 0;
}
.content-area {
      font-size: 30px;
      text-align: center;
  }
 .content-area .tab-content,
 .content-area .tabContent {
    display: none;
  }
.content-area .tab-content.active,
.content-area .tabContent.active {
    margin-top: 50px;
    display: block;
}
@media screen and (max-width:1440px){
    
}
@media screen and (max-width:1300px){

}
@media screen and (max-width:1024px){
    header nav ul li a{
        font-size: 1.4rem;
    }
    .telbtn, .mailbtn{
        min-width: 140px;
    }
}

@media screen and (max-width:768px) {
    .wrap{
        margin: 0 2%;
    }
    .flex{
        display: block;
    }
    .block{
        padding: 40px 0;
    }
    .block-bottom{
        padding-bottom: 40px;
    }
	.pconly{
		display: none;
	}
	.sponly{
		display: block;
	}
    main{
        margin-top: 60px;
    }
	/*--------------------

    ハンバーガーメニュー

	--------------------*/
    header{
        background: #fff;
        top: 0;
        left: 0;
        position: fixed;
        width: 100%;
        z-index: 100;
    }
    .site-title{
        width: 160px;
        height: auto;
        margin: 12px auto 10px;

    }
    /*============
    nav
    =============*/
    .inner nav {
      display: block;
      position: fixed;
      top: 0;
      left: -100vw;
      bottom: 0;
      width: 100%;
      background: #fff;
      overflow-x: hidden;
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
      transition: all .5s;
      z-index: -100;
      opacity: 0;
        margin-top: 61px;
        box-sizing: border-box;
    }
    .open .inner nav {
      left: 0;
      opacity: 1;
        z-index: 100;
        height: 100vh;
    }
    .inner nav {
      padding: 25px;
    }
    .inner nav ul {
      list-style: none;
      margin: 0;
      padding: 0;
        display: block;
    }
    .inner nav ul li {
      position: relative;
      margin: 0;
/*      border-bottom: 1px solid #333;*/
    }

    /*============
    .toggle_btn
    =============*/
    .toggle_btn {
      display: block;
      position: fixed;
      top: 15px;
      right: 15px;
      width: 30px;
      height: 30px;
      transition: all .5s;
      cursor: pointer;
      z-index: 200;
    }
    .toggle_btn span {
      display: block;
      position: absolute;
      left: 0;
      width: 30px;
      height: 2px;
      background-color: #333;
      border-radius: 4px;
      transition: all .5s;
    }
    .toggle_btn span:nth-child(1) {
      top: 4px;
    }
    .toggle_btn span:nth-child(2) {
      top: 14px;
    }
    .toggle_btn span:nth-child(3) {
      bottom: 4px;
    }
    .open .toggle_btn span:nth-child(1) {
      -webkit-transform: translateY(10px) rotate(-315deg);
      transform: translateY(10px) rotate(-315deg);
    }
    .open .toggle_btn span:nth-child(2) {
      opacity: 0;
    }
    .open .toggle_btn span:nth-child(3) {
      -webkit-transform: translateY(-10px) rotate(315deg);
      transform: translateY(-10px) rotate(315deg);
    }
    header nav ul li:first-of-type{
        border-left: none;
        
    }
    header nav ul li a{
        font-size: 1.6rem;
        line-height: 1.2;
/*        border-bottom: #F49702 solid 1px;*/
    }
    header nav ul li .telbtn,
    header nav ul li .mailbtn{
        border: none;
        width: 80%;
        margin: 20px auto 0;
    }
    header nav ul li:first-child a{
/*        border-top: #F49702 solid 1px;*/
    }
    .inner nav ul li{
        border-right: none;
        width: 100%;
    }
    .btnarea .btn,
    .btnarea input[type="submit"]{
        width: 90%;
    }
    footer{
        padding: 40px 0 10px;
    }
    .footer-logo{
        margin: 0 auto 20px;
    }
    footer .inner ul{
        display: block;
    }
    footer .inner ul li{
        margin-bottom: 15px;
    }
    footer .inner ul li a{
        text-align: center;
        display: block;
    }
    footer .inner ul{
        margin-bottom: 40px;
    }
    /*ページタイトル*/
    .page-head{
        padding: 80px 0;
    }
    .page-ttl{
        font-size: 3rem;
    }
    .sec-ttl{
        padding-bottom: 15px;
        margin-bottom: 30px;
    }
    .contact-main .page-head{
        background:url("../images/common/header-contact_sp-min.jpg") no-repeat;
        background-size: cover;
        background-position: center;
    }
    .medical-main .page-head{
        background:url("../images/common/header-medical_sp-min.jpg") no-repeat;
        background-size: cover;
        background-position: center;
    }
    .legal-main .page-head{
        background:url("../images/common/header-legal_sp-min.jpg") no-repeat;
        background-size: cover;
        background-position: center;
    }
    .political-main .page-head{
        background:url("../images/common/header-political_sp-min.jpg") no-repeat;
        background-size: cover;
        background-position: center;
    }
    .news-main .page-head,.post-main .page-head{
        background:url("../images/common/header-news_sp-min.jpg") no-repeat;
        background-size: cover;
        background-position: center;
    }
    .movie-main .page-head{
        background:url("../images/common/header-movie_sp.jpg") no-repeat;
        background-size: cover;
        background-position: center;
    }
    /*トップページ以外に設置してあるformのスタイル*/
    #footer-form{
        background:url("../images/common/header-footer-form-sp-min.jpg") no-repeat;
        background-size: cover;
        background-position: center;
    }
    #footer-form .pconly{
        display: none;
    }
    #footer-form .sponly{
        display: block;
    }
    #footer-form .btnarea .btn.form{
        width: 90%;
        padding: 20px 15px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
    }
    #footer-form .btnarea img{
        margin-bottom: -20px;
        width: 25%;
    }
	#blog .item{
		margin-bottom:30px;
	}
    #allvoices-content .catInner ul{
        flex-direction: column;
    }
    #allvoices-content .catInner li{
        margin: 10px auto;
    }
    #allvoices-content .list-wrap li .popup .inner{
        width: 90%;
        top: 10%;
        transform: translate(-50%, 0);
    }
}
@media screen and (max-width:479px){
    .wrap{
        margin: 0;
        padding: 0 15px;
    }
    .btnarea .btn,
    .btnarea input[type="submit"]{
        padding: 15px 5px;
        font-size: 1.8rem;
    }
    .sec-ttl::before{
        width: 15%;
    }
    .sec-ttl{
        font-size: 2.4rem;
    }
    #medical-content .inner .txt .img{
        margin:15px;
    }
    /*リーガル救済*/
    .qa-box h3{
        font-size: 1.8rem;
    }
    .qa-content .qa-box:first-child{
        margin-top: 30px;
        padding: 20px;
    }
    .qa-content .qa-box:not(:first-child){
        padding: 20px;
    }
    .qa-content .a-area p:not(:last-child){
        padding-bottom: 10px;
    }
    #obi p{
        font-size: 1.4rem;
        line-height: 1.4em;
    }
    #footer-form .btnarea img{
        margin-bottom: -15px;
        width: 25%;
    }
    /*新着投稿動画部分*/
    #blog .movie-area .item{
        width: 100%;
    }
    /*タブ切り替え*/
    .tab-area .tab{
        font-size: 2rem;
    }
    #blog p{
        font-size: 1.3rem;
    }
}
@media screen and (max-width:375px){

}
@media screen and (max-width:330px){
}



