@charset "utf-8";

/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0;}

ol, ul {list-style: none;}
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {font-weight: normal;text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img {border: 0;}
figure {margin:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
/* -------------------------------------------------------------- */

body {
background-color: #fff;
color: #000;
font-size: 62.5%;
font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
line-height: 1.5;
}

/* 全体
------------------------------------------------------------*/
#wrapper {
width: 100%;
margin: 0 auto;
}
.cmn {
clear: both;
float: left;
width: 100%;
}
#content {
padding-top: 80px;
}

/* ヘッダー
------------------------------------------------------------*/
#header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 80px;
background-color: #fff;
z-index: 500;
}
#header_l {
position: relative;
float: left;
width: 300px;
height: 69px;
border-bottom: 11px solid #f9380e;
}
#header_l h1 img {
position: absolute;
bottom: 10px;
left: 20px;
width: 87.5%;
height: auto;
}
#header_l a:hover img {
opacity: 0.5;
filter: alpha(opacity=50);
-ms-filter: "alpha(opacity=50)";
}
#header_r {
position: relative;
float: right;
width : -webkit-calc(100% - 300px) ;
width : calc(100% - 300px) ;
height: 80px;
}
.header_sns {
display: none;
}
#navi {
display: none;
}

/* ハンバーガーメニュー
------------------------------------------------------------*/
#nav-drawer {
position: absolute;
top: 20px;
right: 20px;
}
/*チェックボックス等は非表示に*/
.nav-unshown {
display: none;
}
/*アイコンのスペース*/
#nav-open {
display: inline-block;
width: 30px;
height: 22px;
vertical-align: middle;
}
/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
display: block;
content: '';
position: absolute;
height: 3px;/*線の太さ*/
width: 30px;/*長さ*/
background: #666;
cursor: pointer;
}
#nav-open span:before {
bottom: -10px;
}
#nav-open span:after {
bottom: -20px;
}
/*閉じる用の薄黒カバー*/
#nav-close {
display: none;/*はじめは隠しておく*/
position: fixed;
top: 0;/*全体に広がるように*/
left: 0;
width: 100%;
height: 100%;
background: black;
opacity: 0;
transition: .3s ease-in-out;
z-index: 99;
}
/*中身*/
#nav-content {
overflow: auto;
position: fixed;
top: 0;
left: 0;
width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
max-width: 330px;/*最大幅*/
height: 100%;
background: #fff;/*背景色*/
transition: .3s ease-in-out;/*滑らかに表示*/
-webkit-transform: translateX(-105%);
transform: translateX(-105%);/*左に隠しておく*/
z-index: 9999;/*最前面に*/
}
/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
display: block;/*カバーを表示*/
opacity: .5;
}
#nav-input:checked ~ #nav-content {
-webkit-transform: translateX(0%);
transform: translateX(0%);/*中身を表示（右へスライド）*/
box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
ul#panel li a {
display: block;
position: relative;
height: 60px;
padding: 0 0 0 30px;
color: #000;
border-bottom: 1px solid #d7d7d7;
font-size: 1.5em;
line-height: 60px;
text-decoration: none;
letter-spacing: 1px;
}
ul#panel li a:before{
display: block;
content: "";
position: absolute;
top: 28px;
left: 10px;
width: 10px;
height: 10px;
margin: -4px 0 0 0;
border-top: solid 1px #000;
border-right: solid 1px #000;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
ul#panel li a:hover {
color: #fff;
background-color: #f9380e;
}
ul#panel li.active a {
color: #f9380e;
}
ul#panel li a:hover:before {
border-top: solid 1px #fff;
border-right: solid 1px #fff;
}

/* スライドショー
------------------------------------------------------------*/
.topimage {
position: relative;
float: left;
clear: both;
width: 100%;
height: auto;
}
.topimage img {
width: 100%;
height: auto;
}
#slide_title {
position: absolute;
left: 0;
bottom: 20px;
width: 39.4%;
height: auto;
z-index: 400;
}

/* SNS
------------------------------------------------------------*/
.top-sns_waku {
clear: both;
width: 100%;
margin: 0 auto;
}
.top_sns_w {
width : -webkit-calc(100% - 28px) ;
width : calc(100% - 28px) ;
margin: 0 auto 30px auto;
max-width: 500px;
}
.sns_title {
display: flex;
font-family: 'Lexend Deca', sans-serif;
font-size: 1.6em;
margin: 0 0 5px 0;
}
.sns_title img {
margin: 0 10px 0 5px
}
.sns_border {
width : -webkit-calc(100% - 12px) ;
width : calc(100% - 12px) ;
height : 100%;
max-height: 560px;
border: 6px solid #a6a7a7;
text-align: center;
margin: 0 auto;
background-color: #ccc;
}
.fb-page {
width: 100%;
height: 100%;
}
.innner {
width: 100%; /* 伸縮する横幅 */
max-width: 500px; /* 最大の横幅 */
margin: auto; /* 画面の中央に配置 */
}
.innner iframe{
aspect-ratio: 9 / 16;
width: 100%;
height : 100%;
}
/* お知らせ
------------------------------------------------------------*/
#taisaku {
margin: 20px auto 0 auto;
text-align: center;
}
#taisaku img {
width: 98%;
max-width: 1020px;
height: auto;
}
#taisaku a:hover img {
opacity: 0.5;
filter: alpha(opacity=50);
-ms-filter: "alpha(opacity=50)";
}
.info_top {
padding: 30px 0 15px 0;
}
.title-red {
position: relative;
float: left;
width: 220px;
height: 40px;
border-radius: 0 20px 20px 0;
background-color: #f9380e;
}
.title-red img {
position: absolute;
top: 4px;
left: 20px;
width: 36px;
height: auto;
}
.title-red p {
position: absolute;
top: 0;
left: 65px;
color: #fff;
font-size: 2.5em;
font-weight: 700;
line-height: 40px;
}
.to_list {
position: relative;
float: right;
height: 40px;
}
.to_list p {
position: absolute;
bottom: 0;
right: 10px;
width: 110px;
height: 20px;
border: 2px solid #f9380e;
border-radius: 11px;
color: #f9380e;
font-size: 1.3em;
text-align: center;
line-height: 19px;
}
.to_list a:hover p {
opacity: 0.5;
filter: alpha(opacity=50);
-ms-filter: "alpha(opacity=50)";
}
.info_n {
padding: 0;
}
.top-info_date {
margin: 10px 0 0 10px;
font-size: 1.4em;
color: #636363;
}
.new_red {
color: #f9380e;
font-family: "Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W3","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;
}
.top-info_title {
width : -webkit-calc(100% - 45px) ;
width : calc(100% - 45px) ;
padding: 5px 10px 5px 35px;
color: #000;
font-size: 1.5em;
line-height: 1.3em;
text-indent: -1.6em;
}
.top-info_title img {
margin: 0 10px 0 0;
}
.info_new3 {
border-bottom: 1px solid #c2c2c2;
}
.info_new3:last-child {
border-bottom: none;
}
.info_new3 a {
display: block;
text-decoration: none;
}
.info_new3 a:hover {
opacity: 0.5;
filter: alpha(opacity=50);
-ms-filter: "alpha(opacity=50)";
}
.top-info_txt {
display: block;
overflow: hidden;
height: 2.5em;
padding: 0 10px 10px 35px;
color: #000;
font-size: 1.4em;
}
@supports (-webkit-line-clamp: 2) {
.ellipsis {
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
}
#to_info_l a:hover p {
opacity: 0.5;
filter: alpha(opacity=50);
-ms-filter: "alpha(opacity=50)";
}

/* 理念・政策
------------------------------------------------------------*/
.policy_m {
padding: 30px 0 15px 0;
text-align:center;
}
.policy {
padding: 0 0 15px 0;
background-color: #f6ece2;
text-align:center;
}
.imabari img {
width: 75%;
height: auto;
margin: 30px 0 0 0;
}
#policy_waku {
overflow: hidden;
width: 70%;
margin: 0 auto;
}
.policy0 {
width: 100%;
}
.policy0 img {
width: 100%;
height: auto;
}
.policy1 {
margin: 10px 0 0 0;
}
.policy2 {
margin: 10px 0 0 0;
}
.policy3 {
margin: 10px 0 0 0;
}
.policy4 {
margin: 10px 0 0 0;
}
#policy1 {
padding-top: 80px;
margin-top: -80px;
}
#policy2 {
padding-top: 80px;
margin-top: -80px;
}
#policy3 {
padding-top: 80px;
margin-top: -80px;
}
#policy4 {
padding-top: 80px;
margin-top: -80px;
}
.p_txt {
display: block;
overflow: hidden;
height: 3.8em;
padding: 10px;
font-size: 1.5em;
line-height: 1.5em;
text-align: left;
}
@supports (-webkit-line-clamp: 3) {
.p_ellipsis {
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
}
.continuation {
float: right;
margin: 0 0 10px 0;
padding: 0 10px 0 0;
color: #f9380e;
font-size: 1.2em;
} 
.continuation span {
text-decoration: underline;
}
.policy_naiyou {
position: relative;
width: 100%;
height: auto;
z-index: 1;
}
.policy_naiyou a {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-indent: -999px;
z-index: 500;
}
.policy_naiyou:hover {
filter: alpha(opacity=50);/* IE 6,7*/
-ms-filter: "alpha(opacity=50)";/* IE 8,9 */
-moz-opacity: 0.5;/* FF , Netscape */
-khtml-opacity: 0.5;/* Safari 1.x */
opacity: 0.5;
zoom: 1;/*IE*/
}

/* 政策提言
------------------------------------------------------------*/
.report_n {
padding: 0;
}
#top-report_waku {
overflow: hidden;
width : -webkit-calc(100% - 80px) ;
width : calc(100% - 80px) ;
max-width: 1200px;
margin: 0 auto;
display: flex;
flex-direction: column;
}
.report0 {
position: relative;
width: 100%;
height: auto;
outline: 1px solid #c2c2c2;
outline-offset: -1px;
text-align: center;
z-index: 1;
margin: 0 0 15px 0;
}
.report0 a {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-indent: -999px;
z-index: 500;
}
.report0:hover {
outline: 2px solid #f9380e;
outline-offset: -2px;
}
.report0 img {
width: 97%;
height: auto;
margin: 0 0 30px 0;
}
.top-report_date {
margin: 10px 0 0 10px;
color: #636363;
font-size: 1.4em;
text-align: left;
}

/* fallback for IE */
.top-report_title {
display: block;
overflow: hidden;
width : -webkit-calc(100% - 20px) ;
width : calc(100% - 20px) ;
height: 2.5em;
margin: 0 auto 5px auto;
font-size: 1.8em;
font-weight: 700;
line-height: 1.3em;
text-align: left;
}
@supports (-webkit-line-clamp: 2) {
.trt_ellipsis {
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
}
.top-report_naiyou {
width : calc(100% - 20px) ;
height: auto;
font-size: 1.5em;
line-height: 1.3em;
text-align: left;
position: absolute;
bottom: 10px;
right: 10px;
}
.bold {
font-weight: 700;
}
.top-report_txt {
display: block;
overflow: hidden;
height: 1.5em;
}
.r_cont {
width : -webkit-calc(100% - 10px) ;
width : calc(100% - 10px) ;
padding: 10px 10px 0 0;
color: #f9380e;
font-size: 80%;
text-align: right;
} 
.r_cont span　{
text-decoration: underline;
}

/* TANTAN日記
------------------------------------------------------------*/
.diary_top {
position: relative;
border-bottom: 2px solid #f83e2a;
margin: 120px 0 0 0;
}
#diary-illust img {
position: absolute;
left: 5%;
bottom: -1px;
width: 27%;
min-width: 150px;
height: auto;
margin:0 15px 0 0;
}
#diary-title {
position: absolute;
right: 10px;
bottom: 5px;
font-size: 2em;
font-weight: 700;
line-height: 30px;
}
#diary-title img {
display: none;
}
.diary_n {
padding: 30px 0 0 0;
}
#top_diary_waku {
overflow: hidden;
width: 100%;
margin: 0 auto;
}
.diary0 {
position: relative;
float: left;
width : -webkit-calc(100% - 28px) ;
width : calc(100% - 28px) ;
height: auto;
padding: 16px 14px;
background-color: #fff;
z-index: 1;
}
.diary0 img {
float: left;
width: 31%;
height: auto;
padding: 2px;
border: 1px solid #c2c2c2;
background-color: #fff;
}
.diary0 a {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-indent: -999px;
z-index: 500;
}
.diary0:hover {
background-color: #ffd8e1;
}
.diary1 {
margin: 0 0 15px 0;
}
.diary2 {
clear: both;
margin: 0;
}
.diary3 {
clear: both;
margin: 0;
}
.diary4 {
clear: both;
margin: 0;
}
.t_diary_naiyou {
float: left;
width : -webkit-calc(69% - 20px) ;
width : calc(69% - 20px) ;
padding: 0 0 0 13px;
}
.t_diary_date {
color: #636363;
font-size: 1.4em;
text-align: left;
}
.t_diary_title {
display: block;
overflow: hidden;
width : -webkit-calc(100% - 20px) ;
width : calc(100% - 20px) ;
height: 1.2em;
margin: 12px 0;
font-size: 1.1em;
line-height: 1.3em;
text-align: left;
}
@supports (-webkit-line-clamp: 1) {
.dt_ellipsis {
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
}
.t_diary_txt {
display: block;
overflow: hidden;
height: 6.8em;
font-size: 1.3em;
line-height: 1.2em;
}
@supports (-webkit-line-clamp: 6) {
.d_ellipsis {
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 6;
-webkit-box-orient: vertical;
}
}
.diary_bottom {
float: right;
padding: 0 15px 30px 0;
}
.to_list_d {
position: relative;
float: right;
height: 30px;
}
.to_list_d p {
position: absolute;
bottom: 0;
right: 0;
width: 150px;
height: 20px;
border: 2px solid #f9380e;
color: #f9380e;
font-size: 1.3em;
line-height: 22px;
border-radius: 11px;
text-align: center;
}
.to_list_d a:hover p {
opacity: 0.5;
filter: alpha(opacity=50);
-ms-filter: "alpha(opacity=50)";
}

/* プロフィール
------------------------------------------------------------*/
.profile {
position: relative;
margin: 0 0 750px 0;
}
#profile-box {
position: absolute;
top: 0;
left: 0;
width : -webkit-calc(100% - 250px) ;
width : calc(100% - 250px) ;
height: 200px;
background-color: #f83e2a;
z-index: 2;
}
#profile-triangle {
position: absolute;
top: 0; 
right: 200px;
border-bottom: 200px solid transparent;
border-left: 50px solid #f83e2a;
z-index: 3;
}
#profile-img {
position: absolute;
top: 0;
right: 0;
z-index: 1;
}
#profile-img img {
width: 313px;
height: 200px;
}
#profile-title {
position: relative;
}
#profile-titleback img {
position: absolute;
top: 0;
left: 0;
z-index: 2;
}
#profile-pen img{
position: absolute;
top: 15px;
left: 10px;
width: 30px;
height: auto;
z-index: 300;
}
.profile p {
position: absolute;
top: 15px;
left: 45px;
color: #fff;
font-size: 2.5em;
font-weight: 700;
line-height: 40px;
z-index: 300;
}
#profile_waku {
position: absolute;
overflow: hidden;
top: 100px;
left: 6%;
width : -webkit-calc(90% - 50px) ;
width : calc(90% - 50px) ;
padding: 25px;
background-color: #f83e2a;
box-shadow: 0px 0px 7px 0px #000;
z-index: 400;
}
#profile-name {
position: static;
display: table;
color: #fff;
font-size: 3em;
font-weight: 700;
}
#profile-name span {
display: table-cell;
vertical-align: middle;
font-size: 38%;
padding: 0 0 0 20px;
letter-spacing: 6px;
}
#ryakureki {
position: static;
width: 40px;
margin: 5px 0 10px 0;
padding: 2px 5px;
border: 1px solid #fff;
border-radius: 2px;
font-size: 1.5em;
line-height: 1em;
text-align: center;
}
#profile-ename img {
position: absolute;
bottom: 0;
right: 10px;
width: 150px;
height: auto;
z-index: 500;
}
.profile_dl {
margin: 0 0 20px 0;
color: #fff;
}
.profile_list {
display: flex;
flex-direction: column;
margin: 0 0 5px 0;
}
.profile_m {
margin: 0;
}
.profile_dl .profile_list dt,
.profile_dl .profile_list dd {
font-size: 1.2em;
}
.profile_dl .profile_list dd {
padding: 0 0 0 1em;
}
.profile_dl .profile_list dd:before {
content: '・';
}
.br_pc {
display: none;
}

/* リンクバナー
------------------------------------------------------------*/
#link_banner_waku {
overflow:hidden;
width: 100%;
margin: 0 auto 30px auto;
text-align: center;
}
.link_banner1 {
margin: 0 0 10px 0;
}
.link_banner2 {
margin: 0 0 10px 0;
}

/* フッター
------------------------------------------------------------*/
.footer {
position: relative;
height: 200px;
background-color: #f9380e;
border-top: 45px solid #e9e9e8;
}
.footer_sns {
position: absolute;
top: 20px;
right: 30px;
}
.footer_title {
position: absolute;
bottom: 10px;
left: 30px;
}
#footer_title_name {
padding: 0 40px 0 0;
width: 300px;
border-bottom: 2px solid #d22e0b;
color: #fff;
font-size: 1.5em;
font-weight: 700;
line-height: 1.3em;
}
#rubi {
font-size: 60%;
}
#footer_title_url {
color: #fff;
font-family: 'Lexend Deca', sans-serif;
font-size: 1.6em;
font-style: italic;
letter-spacing: 1px;
}
#footer_add {
margin: 15px 0 0 0;
padding: 0 30px 0 0;
color: #fff;
font-size: 1.5em;
font-weight: 700;
line-height: 1.3em;
letter-spacing: 1px;
}
#footer_tel {
color: #fff;
font-family: 'Lexend Deca', sans-serif;
font-size: 1.5em;
font-style: italic;
letter-spacing: 1px;
}
.copyright {
width : -webkit-calc(100% - 20px) ;
width : calc(100% - 20px) ;
padding: 13px 20px 20px 0;
text-align: right;
}
#copy {
color: #f9380e;
font-family: 'Ropa Sans', sans-serif;
font-size: 1.5em;
line-height: 1.5em;
}
#privacy {
font-size: 1.4em;
font-weight: 700;
letter-spacing: 2px;
}
#privacy a {
color: #636363;
text-decoration: none;
}
#privacy a:hover {
text-decoration: underline;
}

/* ページトップボタン
------------------------------------------------------------*/
.pagetop {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 500;
}
.pagetop a {
display: block;
text-decoration: none;
}
.pagetop:hover {
opacity: 0.5;
}

/* フェードイン
------------------------------------------------------------*/
.fadein {
opacity: 0;
transform: translate(0, 100px);
transition: all 1s;
}
.fadein.active{
opacity: 1;
transform: translate(0, 0);
}