@charset "UTF-8";
/*
Theme Name: Tomoe Ishii
Description: 愛媛県議会議員いしいともえ公式ウェブサイト用テンプレート
Version:1.0
*/
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,700");
/* @import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,500,700,900&display=swap&subset=japanese"); */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&display=swap");

/* HTML5 Reset */
html,
body,
body div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  font-weight: normal;
  box-sizing: border-box;
}

article,
aside,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block;
}

/* force a vertical scrollbar to prevent a jumpy page */
/* we use a lot of ULs that aren't bulleted. 
    don't forget to restore the bullets within content. */
ol,
ul {
  list-style: none;
}

a {
  text-decoration: none;
}

del {
  text-decoration: line-through;
}

/* tables still need cellspacing="0" in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

th,
td {
  font-weight: normal;
  vertical-align: middle;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

input,
select {
  vertical-align: middle;
}

pre {
  white-space: pre;
  /* CSS2 */
  white-space: pre-wrap;
  /* CSS 2.1 */
  white-space: pre-line;
  /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word;
  /* IE */
}

input[type="radio"] {
  vertical-align: middle;
}

input[type="checkbox"] {
  vertical-align: middle;
  *vertical-align: middle;
}

.ie6 input {
  vertical-align: middle;
}

select,
input,
textarea {
  font: 99% sans-serif;
}

table {
  font-size: inherit;
  font: 100%;
}

/* Accessible focus treatment
    people.opera.com/patrickl/experiments/keyboard/test */
a:hover,
a:active {
  outline: none;
}

small {
  font-size: 85%;
}

strong {
  font-weight: bold;
}

td img {
  vertical-align: top;
}

/* Make sure sup and sub don't screw with your line-heights
    gist.github.com/413930 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* standardize any monospaced elements */
pre,
code,
kbd,
samp {
  font-family: monospace, sans-serif;
}

/* hand cursor on clickable elements */
.clickable,
label,
input[type="button"],
input[type="submit"],
button {
  cursor: pointer;
}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button,
input,
select,
textarea {
  margin: 0;
}

/* make buttons play nice in IE */
button {
  width: auto;
  overflow: visible;
}

/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic;
}

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

/* clearfix */
.clearfix {
  width: 100%;
  zoom: 1;
}

.clearfix:before,
.clearfix:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden;
  clear: both;
}

/* we like off-black for text */
select,
input,
textarea {
  color: #333;
}

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection {
  background: #fcd700;
  color: #fff;
  text-shadow: none;
}

::selection {
  background: #fcd700;
  color: #fff;
  text-shadow: none;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

a {
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

/* HTML5 Reset end
  -------------------------------------------------------------------------------*/
/* デフォルトフォントファミリー設定 */
body,
input,
textarea {
  font-family: -apple-system, BlinkMacSystemFont, "Lucida Grande", Roboto,
    "Droid Sans", "Noto Sans JP", "ヒラギノ角ゴ ProN W3",
    "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "游ゴシック Medium",
    YuGothicM, YuGothic, メイリオ, Meiryo, sans-serif;
  font-size: 14px;
  color: #282828;
  line-height: 1.7;
  -webkit-text-size-adjust: 100%;
}

/* *********************************************
色 
********************************************* */
/* *********************************************
フォント 
********************************************* */
.noto {
  font-family: "Noto Sans JP", sans-serif;
}

.noto-bolder {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 900;
}

.pink {
  color: #d52572;
}

@media screen and (max-width: 340px) {
  .se_hide {
    display: none;
  }
}

.se_show {
  display: none;
}

@media screen and (max-width: 340px) {
  .se_show {
    display: inline;
  }
}

/* *********************************************
boxes
********************************************* */
body {
  width: 100%;
}

@media screen and (max-width: 1160px) {
  body {
    min-width: 1160px;
  }
}

@media screen and (max-width: 767px) {
  body {
    min-width: initial;
  }
}

.box1600 {
  max-width: 1600px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 1160px) {
  .box1600 {
    max-width: 100%;
  }
}

.box1160 {
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

.box1160 .left-box,
.box1160 .right-box {
  max-width: 560px;
}

@media screen and (max-width: 767px) {
  .box1160 .left-box,
  .box1160 .right-box {
    width: 100%;
    max-width: 100%;
    float: none;
  }
}

.box1000 {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

.box820 {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 767px) {
  .box1600,
  .box1160,
  .box1000,
  .box820 {
    width: 100%;
    max-width: 100%;
  }
  .sp-box {
    padding: 20px 15px;
  }
}

/* フレックスボックス */
.flexboxes {
  display: flex;
  display: -ms-flex;
  display: -webkit-flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
}

/* *********************************************
リスト
********************************************* */
.pinkdots li {
  text-indent: -1em;
  padding-left: 1em;
}

.pinkdots li:before {
  content: "■";
  margin-right: 5px;
  color: #d52572;
  font-size: 8px;
}

/* *********************************************
セクション仕切りの縦棒
********************************************* */
.ver-bar {
  position: relative;
  width: 6px;
  height: 100px;
  background-color: #d52572;
  margin: -50px auto 0;
  z-index: 80;
}

@media screen and (max-width: 1000px) {
  .ver-bar {
    z-index: -10;
  }
}

@media screen and (max-width: 767px) {
  .ver-bar {
    width: 4px;
    height: 60px;
    margin: -30px auto 0;
  }
}

/* *********************************************
グラデーションボタン
********************************************* */
.grad_button {
  position: relative;
  display: block;
  width: 190px;
  height: 45px;
  margin: 40px auto;
  line-height: 43px;
  border: 2px solid #ef9fc2;
  border-radius: 23px;
  background: #e57ba9;
  /* Old browsers */
  background: -moz-linear-gradient(left, #e57ba9 0%, #d52572 99%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #e57ba9 0%, #d52572 99%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #e57ba9 0%, #d52572 99%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e57ba9', endColorstr='#d52572',GradientType=1 );
  /* IE6-9 */
  color: #fff;
  font-weight: bold;
  text-align: center;
}

.grad_button:hover {
  opacity: 0.8;
}

.grad_button.outbound-link:after {
  content: url(./img/parts/outbound.png);
  display: block;
  width: 16px;
  height: 14px;
  position: absolute;
  right: 7px;
  top: 2px;
}

@media screen and (max-width: 767px) {
  .grad_button {
    margin: 25px auto;
  }
}

/* *********************************************
ヘディング
********************************************* */
.section-title span {
  display: block;
  text-align: center;
}

.section-title .title-ja {
  font-size: 36px;
  font-weight: bold;
}

.section-title .title-en {
  font-size: 18px;
  font-style: italic;
  font-weight: 600;
}

@media screen and (max-width: 767px) {
  .section-title .title-ja {
    font-size: 26px;
  }
  .section-title .title-en {
    font-size: 14px;
  }
}

.h2-pink-gray {
  position: relative;
  padding: 20px 0 10px;
  margin-bottom: 20px;
  line-height: 1;
  font-size: 18px;
  font-weight: 600;
  color: inherit;
  border-bottom: 2px solid #bfbfbf;
}

.h2-pink-gray:after {
  content: url("./img/parts/h2-prof-border.png");
  position: absolute;
  bottom: -5px;
  left: 0;
}

@media screen and (max-width: 767px) {
  .h2-pink-gray {
    font-size: 16px;
  }
}

.h2-side-pink {
  height: 50px;
  line-height: 50px;
  padding-left: 24px;
  margin-bottom: 20px;
  border-left: 5px solid #d52572;
  font-size: 24px;
}

/* *********************************************
定義リスト
********************************************* */
.std-dl dt {
  float: left;
  font-weight: bold;
}

.std-dl dd {
  padding-left: 80px;
}

/* *********************************************
ページヘッダー
********************************************* */
.fixed-header {
  position: fixed;
  top: 0;
  width: 100%;
  height: 90px;
  background: #fff;
  z-index: 1000;
  border-bottom: 1px solid #eee;
}

@media screen and (max-width: 767px) {
  .fixed-header {
    position: relative;
    top: auto;
    height: auto;
    border: none;
  }
}

.site-header {
  position: relative;
  height: 90px;
  padding: 0 25px;
}

.site-header .sp-menu {
  display: none;
}

@media screen and (max-width: 767px) {
  .site-header {
    height: 70px;
  }
  .site-header .sp-menu {
    display: block;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 10px;
    right: 10px;
    z-index: 100;
    opacity: 0.7;
    background: url("./img/sp/menu_on.png") center center no-repeat;
  }
  .site-header .sp-menu.active {
    background: url("./img/sp/menu_off.png") center center no-repeat;
  }
}

.site-header .site-title {
  float: left;
  max-width: 300px;
  padding: 18px 5px;
  line-height: 1.4;
}

.site-header .site-title .sup {
  display: block;
  font-size: 16px;
}

.site-header .site-title .name-ishii {
  display: block;
  font-size: 28px;
}

.site-header .site-title .name-ishii .pink {
  font-size: 32px;
}

@media screen and (max-width: 767px) {
  .site-header .site-title {
    padding: 10px 5px;
  }
  .site-header .site-title .sup {
    font-size: 14px;
  }
  .site-header .site-title .name-ishii {
    font-size: 24px;
  }
  .site-header .site-title .name-ishii .pink {
    font-size: 24px;
  }
}

.site-header .g-navi {
  max-width: 840px;
  float: right;
}

@media screen and (max-width: 767px) {
  .site-header .g-navi {
    overflow: hidden;
    position: fixed;
    float: none;
    width: 100%;
    height: 100vh;
    left: 100%;
    top: 70px;
    background-color: rgba(213, 37, 114, 0.7);
    z-index: 1000;
  }
}

.site-header .g-navi li {
  display: block;
  float: left;
}

.site-header .g-navi li a {
  display: block;
  padding: 30px 20px 28px;
  font-size: 16px;
  font-weight: 500;
  color: inherit;
}

@media screen and (max-width: 767px) {
  .site-header .g-navi li {
    float: none;
  }
  .site-header .g-navi li a {
    width: 100%;
    padding: 15px 20px 15px;
    background-color: rgba(213, 37, 114, 0.7);
    border-bottom: 2px solid #fff;
    color: #fff;
  }
}

/* *********************************************
アイキャッチ画像
********************************************* */

/*
2021年3月25日〜
メインビジュアル等更新
*/
.main-image {
  position: relative;
  width: 100%;
  /* height: calc(100vh - 90px); */
  /* max-height: 675px; */
  height: 675px;
  background-color: #d52572;
  margin-top: 90px;
  color: #fff;
}

.main-image-pink-line {
  width: 100%;
  height: 108px;
  background: rgba(203, 2, 31, 0.5);
}

.main-image-contents {
  width: 100%;
  max-width: 1200px;
  /* height: calc(100vh - 90px);
  max-height: 675px; */
  height: 675px;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -600px;
}

.top-image-title {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  background: url("./img/renewal/ishii-image.png") bottom -90px left no-repeat;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 900;
  color: #fff;
  line-height: 1.1;
}

.top-image-title span {
  text-align: right;
}

.top-image-title .sup {
  font-size: 32px;
}

.top-image-title .name-ishii {
  display: block;
  width: 55%;
  position: absolute;
  right: 0;
  top: 108px;
  text-align: right;
}

.top-image-title .name-ishii-ishii {
  font-size: 210px;
  font-weight: 700;
}
.top-image-title .name-ishii-tomoe {
  font-size: 120px;
  font-weight: 700;
}

.top-image-title .kangoshi {
  position: absolute;
  right: 24%;
  bottom: 20px;
  line-height: 54px;
  text-align: left;
  font-size: 36px;
  font-weight: 700;
}

.party-name-area {
  position: absolute;
  top: 0;
  left: 2%;
  width: 96%;
  height: 108px;
  padding: 33px 0;
  line-height: 1;
}
.party-name-area .party-name {
  font-size: 43px;
  text-align: right;
}

.main-image .kokumin-logo {
  width: 250px;
  height: 120px;
  position: absolute;
  right: 0;
  bottom: 0;
}
.main-image .kokumin-logo img {
  display: inline-block;
  margin: 0;
}
.main-image .kokumin-logo .kokuminusagi {
  float: right;
  margin-top: -20px;
  width: 75px;
}
.main-image .kokumin-logo .kokuminlogo {
  float: left;
  width: 160px;
}

@media screen and (max-width: 1200px) {
  .main-image-contents {
    margin-left: 0;
    left: 0;
  }
  .top-image-title {
    width: 96%;
    left: 2%;
  }
  .top-image-title .name-ishii-ishii {
    font-size: 180px;
    font-weight: 700;
  }
  .top-image-title .name-ishii-tomoe {
    font-size: 120px;
    font-weight: 700;
  }

  .top-image-title .kangoshi {
    /* left: 20%; */
    line-height: 65px;
    font-size: 40px;
    font-weight: 500;
  }
  .party-name-area .party-name {
    font-size: 38px;
  }
  .main-image .kokumin-logo {
    right: 2%;
  }
}

@media screen and (max-width: 768px) {
  .main-image {
    margin-top: 0;
  }
  .top-image-title {
    background-size: 490px;
    background-position: bottom 0 left -80px;
    width: 100%;
    left: 0;
  }
  .top-image-title .name-ishii {
    width: 60%;
    right: 5%;
    top: 135px;
  }
  .top-image-title .name-ishii-ishii {
    font-size: 110px;
  }
  .top-image-title .name-ishii-tomoe {
    font-size: 70px;
  }
  .top-image-title .kangoshi {
    left: 20%;
    line-height: 50px;
    font-size: 26px;
    font-weight: 400;
  }
  .main-image-pink-line {
    height: 90px;
  }
  .party-name-area {
    height: 90px;
    padding: 25px 0;
  }
  .party-name-area .party-name {
    font-size: 32px;
    text-align: center;
  }
}

@media screen and (max-width: 600px) {
  .main-image,
  .main-image-contents {
    /* max-height: 100vh; */
    max-height: 600px;
  }
  .main-image-contents {
    top: 0;
  }
  .top-image-title {
    background-size: 440px;
    background-position: bottom 0 left -80px;
  }
  .top-image-title .name-ishii-ishii {
    font-size: 90px;
  }
  .top-image-title .name-ishii-tomoe {
    font-size: 58px;
  }
  .top-image-title .kangoshi {
    left: 18%;
    line-height: 42px;
    font-size: 22px;
  }
}

@media screen and (max-width: 500px) {
  .main-image,
  .main-image-contents {
    max-height: 450px;
  }
  .top-image-title {
    background-size: 330px;
    background-position: bottom 0 left -80px;
  }
  .top-image-title .name-ishii {
    top: 130px;
  }
  .top-image-title .name-ishii-ishii {
    font-size: 60px;
  }
  .top-image-title .name-ishii-tomoe {
    font-size: 38px;
  }
  .top-image-title .kangoshi {
    left: 6%;
    line-height: 22px;
    font-size: 18px;
  }
  .main-image-pink-line {
    height: 70px;
  }
  .party-name-area {
    height: 70px;
    padding: 25px 0;
  }
  .party-name-area .party-name {
    font-size: 20px;
  }
  .main-image .kokumin-logo {
    width: 30%;
    height: 180px;
    text-align: center;
    line-height: 1;
  }
  .main-image .kokumin-logo .kokuminusagi {
    float: none;
    width: 46%;
    margin: 0;
  }
  .main-image .kokumin-logo .kokuminlogo {
    float: none;
    width: 100%;
    margin-top: -6px;
  }
}

@media screen and (max-width: 400px) {
  .main-image,
  .main-image-contents {
    max-height: 410px;
  }
  .top-image-title {
    background-size: 290px;
    background-position: bottom 0 left -50px;
  }
  .top-image-title .name-ishii {
    top: 106px;
  }
  .main-image .kokumin-logo {
    height: 164px;
  }
}
@media screen and (max-width: 320px) {
  .main-image,
  .main-image-contents {
    max-height: 390px;
  }
  .top-image-title .name-ishii-ishii {
    font-size: 52px;
  }
  .top-image-title .name-ishii-tomoe {
    font-size: 33px;
  }
  .top-image-title .kangoshi {
    font-size: 14px;
  }
  .top-image-title {
    background-size: 280px;
    background-position: bottom 0 left -65px;
  }
  .top-image-title .name-ishii {
    top: 106px;
  }
  .main-image .kokumin-logo {
    height: 140px;
  }
}
/* *********************************************
section : information
********************************************* */
.section-information {
  margin-top: 20px;
  margin-bottom: 80px;
}

@media screen and (max-width: 767px) {
  .section-information {
    margin-bottom: 40px;
  }
}
/* *********************************************
タブ切り替え
********************************************* */
.tab_wrap {
  width: 100%;
  margin: 80px auto;
}

@media screen and (max-width: 767px) {
  .tab_wrap {
    margin: 20px auto;
  }
}

.tab_area {
  font-size: 0;
  margin: 0;
}

.tab_area label {
  position: relative;
  display: inline-block;
  width: 160px;
  margin-right: 2px;
  padding: 12px 0;
  border-top: 2px solid #d52572;
  background: #f8f7fb;
  font-size: 14px;
  text-align: center;
  cursor: pointer;
}

.tab_area label.active {
  background: #fff;
  color: #000;
  border-right: 1px solid #333;
  border-left: 1px solid #333;
  border-bottom: 1px solid #fff;
  z-index: 10;
}

@media screen and (max-width: 767px) {
  .tab_area label {
    width: calc(25% - 2px);
    font-size: 12px;
  }
}

.panel_area {
  position: relative;
  width: 100%;
  height: 500px;
  margin-top: -2px;
  background: #fff;
  border-top: 1px solid #333;
}

@media screen and (max-width: 767px) {
  .panel_area {
    height: auto;
  }
}

.tab_panel {
  width: 100%;
  padding: 25px 0;
  display: none;
}

.tab_panel p {
  font-size: 14px;
}

.tab_panel.active {
  display: block;
}

.panel2-box {
  overflow: hidden;
}

/* *********************************************
タブ内容
********************************************* */
/* *** アメーバブログ *** */
.ameblo_rss {
  width: 80%;
  margin: 20px auto;
}

.ameblo_rss li {
  padding: 20px 0;
  border-bottom: 1px dotted #ccc;
}

.ameblo_rss li:first-child {
  border-top: 1px dotted #ccc;
}

.ameblo_rss li .top-date {
  display: block;
  width: 100px;
  float: left;
}

.ameblo_rss li a {
  display: block;
  float: left;
  width: calc(100% - 100px);
  color: inherit;
}

.ameblo_rss li a:hover {
  color: #000;
}

@media screen and (max-width: 767px) {
  .ameblo_rss {
    width: 90%;
  }
  .ameblo_rss li {
    font-size: 13px;
  }
  .ameblo_rss li .top-date {
    width: 75px;
  }
  .ameblo_rss li a {
    width: calc(100% - 75px);
  }
}

/* *** 選挙ドットコム *** */
.senkyo_embed_wrap {
  width: 660px;
  height: 400px;
  margin: 20px auto;
}

.senkyo_embed_wrap iframe {
  width: 660px;
  height: 400px;
}

/* *** Twitter *** */
.twitter_embed_wrap {
  width: 660px;
  height: 400px;
  margin: 20px auto;
  overflow: scroll;
  border: 1px solid #ccc;
  border-radius: 8px;
}

@media screen and (max-width: 767px) {
  .twitter_embed_wrap {
    width: 90%;
  }
}

/* *** お知らせ *** */
.tab_panel .post-list {
  width: 80%;
  margin: 20px auto;
}

/* ここから　2021/04/19 修正 */
.report-post-list.flexboxes {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}

.tab_panel .report-post-list article {
  width: 23%;
  margin-right: 2%;
  margin-bottom: 15px;
}

.report-link.grad_button {
  margin: 20px auto;
}

/* ここまで　2021/04/19 修正 */
.tab_panel .report-post-list article .post-thumbnail {
  height: 180px;
}

.tab_panel .report-post-list .grad_button {
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .tab_panel .report-post-list {
    width: 90%;
  }
  .tab_panel .report-post-list article {
    width: 48%;
  }
  .tab_panel .report-post-list article .post-thumbnail {
    height: 110px;
  }
}

/* *********************************************
aside : 応援ページ
********************************************* */
.link-supporters {
  background-color: #f8f7fb;
  padding: 80px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .link-supporters {
    padding: 40px 30px;
  }
}

/* *********************************************
section : プロフィール
********************************************* */
.section-profile {
  position: relative;
  overflow: hidden;
}

.section-profile .section-title {
  position: relative;
  height: 558px;
  margin-bottom: 60px;
}

@media screen and (max-width: 767px) {
  .section-profile .section-title {
    height: auto;
    margin-bottom: 0;
  }
}

.section-profile .section-title .profile-image {
  position: absolute;
  top: 0;
  left: 336px;
}

@media screen and (max-width: 1160px) {
  .section-profile .section-title .profile-image {
    left: auto;
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .section-profile .section-title .profile-image {
    width: 100%;
    position: static;
  }
}

.section-profile .section-title .tile-front,
.section-profile .section-title .tile-back {
  width: 366px;
  height: 366px;
  position: absolute;
}

@media screen and (max-width: 767px) {
  .section-profile .section-title .tile-front,
  .section-profile .section-title .tile-back {
    width: 180px;
    height: 140px;
  }
}

.section-profile .section-title .tile-front {
  background-color: #d52572;
  top: 100px;
  left: 42px;
  text-align: center;
}

.section-profile .section-title .tile-front span {
  color: #fff;
}

.section-profile .section-title .tile-front span.title-ja {
  padding-top: 124px;
  line-height: 1.4;
}

.section-profile .section-title .tile-front span.title-en {
  line-height: 3;
}

@media screen and (max-width: 767px) {
  .section-profile .section-title .tile-front {
    top: 70px;
    left: 10px;
  }
  .section-profile .section-title .tile-front span.title-ja {
    font-size: 22px;
    padding-top: 30px;
  }
  .section-profile .section-title .tile-front span.title-ja.title-en {
    font-size: 12px;
  }
}

.section-profile .section-title .tile-back {
  background-color: #f19ec2;
  top: 113px;
  left: 53px;
}

@media screen and (max-width: 767px) {
  .section-profile .section-title .tile-back {
    top: 75px;
    left: 15px;
  }
}

.prof-content-wrap {
  background-color: #f8f7fb;
}

.prof-content > div {
  width: 560px;
}

.prof-content > div.left-box {
  float: left;
}

.prof-content > div.right-box {
  float: right;
}

@media screen and (max-width: 767px) {
  .prof-content > div {
    width: 100%;
  }
}

.prof-content ul,
.prof-content dl {
  margin-bottom: 20px;
}

.prof-content h3 {
  font-size: 16px;
  font-weight: bold;
}

.profile-introduction {
  padding: 1em;
  font-size: 13px;
}

/* スライダー */
.slider-wrapper {
  width: 97%;
  height: auto;
  padding: 8px;
  margin: 40px auto 10px;
  border-radius: 5px;
  box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.4);
}

/* これまでの社会活動の内容 */
.society-activity .soc-head {
  width: 100%;
  line-height: 1;
}

.society-activity .soc-year {
  width: 120px;
  height: 40px;
  padding: 13px 10px;
  float: left;
  background-color: #898989;
  color: #fff;
  text-align: center;
}

.society-activity .soc-title {
  width: calc(100% - 120px);
  height: 40px;
  padding: 13px 20px;
  float: left;
  background-color: #f3f3f3;
  font-weight: bold;
}

.society-activity .soc-description {
  width: 100%;
  padding: 15px 60px 15px 140px;
}

@media screen and (max-width: 767px) {
  .society-activity .soc-year {
    float: none;
  }
  .society-activity .soc-title {
    float: none;
    width: 100%;
    height: auto;
    padding: 10px 15px;
    line-height: 1.6;
  }
  .society-activity .soc-description {
    padding: 20px 15px;
  }
}

.youtube-wrap {
  width: 560px;
  margin: 60px auto;
}

.youtube-wrap .youtube-content {
  position: relative;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
}

.youtube-wrap .youtube-content iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 767px) {
  .youtube-wrap {
    width: 100%;
    margin: 20px auto 40px;
  }
}

.youtube-embed {
  margin-bottom: 40px;
}

/* *********************************************
section : 私が国政を目指す理由
section : いしいともえが目指す「国のあるべき姿」
********************************************* */
.section-reason {
  position: relative;
  width: 100%;
  height: 1160px;
  margin-bottom: 100px;
}

.section-reason .reason-bg {
  width: 100%;
  height: 1160px;
  text-align: right;
  background: url(./img/reason.jpg) top left no-repeat #d52572;
  background-size: auto 1160px;
}

.section-reason .reason-content-wrap {
  right: 8%;
  height: 900px;
}

.reason-content-wrap {
  position: absolute;
  top: 130px;
  width: 694px;
  background-color: #fff;
  padding: 32px 42px;
  box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.4);
}

.reason-content-wrap h1 {
  font-size: 24px;
  color: #d52572;
  text-align: center;
  line-height: 2;
  margin: 10px;
}

.reason-content-wrap h2 {
  font-size: 110%;
  font-weight: bold;
  line-height: 2;
}

.reason-content-wrap p {
  margin-bottom: 1.5em;
}

.section-sugata {
  position: relative;
  width: 100%;
  height: 775px;
}


.section-sugata .reason-bg {
  width: 100%;
  height: 775px;
  text-align: right;
  background: url(./img/sugata.jpg) top right no-repeat #d52572;
}


.section-sugata .reason-content-wrap {
  left: 8%;
  height: 585px;
}

@media screen and (max-width: 1420px) and (min-width: 1261px) {
  .section-reason .reason-bg {
    background-position: top left -60%;
  }

}

@media screen and (max-width: 1260px) and (min-width: 1160px) {
  .section-reason .reason-bg {
    background-position: top left -140%;
  }
}

@media screen and (max-width: 1420px) and (min-width: 1361px) {

  .section-sugata .reason-bg {
    background-position: top right -60%;
  }
}

@media screen and (max-width: 1360px) and (min-width: 1261px) {

  .section-sugata .reason-bg {
    background-position: top right -100%;
  }
}

@media screen and (max-width: 1260px) and (min-width: 1161px) {

  .section-sugata .reason-bg {
    background-position: top right -200%;
  }
}


@media screen and (max-width: 1160px) {
  .section-reason,
  .section-sugata {
    height: auto;
  }
  .section-reason .reason-bg,
  .section-sugata .reason-bg {
    /* background: #d52572; */
    display: none;
  }
  .section-reason .reason-content-wrap,
  .section-sugata .reason-content-wrap {
    right: auto;
    left: auto;
    top: auto;
    position: relative;
    margin: 0 auto;
    z-index: 100;;
    /* margin-left: calc( (100vw - 694px ) / 2); */

  }
}
@media screen and (max-width: 960px) {
  .reason-content-wrap p {
    line-height: 1.5;
  }
  .reason-content-wrap {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}


@media screen and (max-width: 767px) {
  .section-reason,
  .section-sugata  {
    height: auto;
    background: #d52572;
    padding-bottom: 20px;
    padding: 20px 0;
  }

  .reason-bg {
    display: none;
  }

  .reason-content-wrap h1 {
    margin: 10px 10px 20px;
    line-height: 1.5;
    font-size: 20px;
  }
  .reason-content-wrap h2 {
    margin-bottom: 10px;
    line-height: 1.5;
  }

  .section-reason .reason-content-wrap,
  .section-sugata .reason-content-wrap {
    height: auto;

  }

  .reason-content-wrap {
    position: relative;
    top: auto;
    width: calc(100% - 40px);
    padding: 20px;
    margin: 0 auto;
  }

}



/* *********************************************
section : 基本理念
********************************************* */
.principle-content-wrap {
  margin: 40px auto 80px;
}
.principle-content-wrap p {
  text-align: center;
  font-size: 140%;
  font-style: italic;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .principle-content-wrap {
    margin-top: 20px;
  }

}

/* *********************************************
section : 政策（マニフェスト）
********************************************* */
.section-manifest {
  width: 100%;
  background-color: #fff;
  margin-bottom: 40px;
}

.section-manifest .section-title {
  margin-top: 18px;
  margin-bottom: 28px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .section-manifest .section-title {
    margin-bottom: 0;
  }
  
}

.section-manifest .section-title .title-ja {
  display: inline;
}

.section-manifest .section-title .title-ja .subtitle {
  display: inline;
  font-size: 24px;
  font-weight: bold;
}

.manifest-content-wrap h2 {
  width: 100%;
  height: 98px;
  background-color: #f8f7fb;
  padding: 0 32px;
  margin-bottom: 10px;
  margin-top: 30px;
}

.manifest-content-wrap h2 span {
  display: inline-block;
  vertical-align: middle;
}

.manifest-content-wrap h2 span.num {
  margin-right: 38px;
  font-size: 60px;
  font-style: italic;
  color: #d52572;
  font-weight: bolder;
}

.manifest-content-wrap h2 span.title {
  font-size: 24px;
  font-weight: bold;
}

@media screen and (max-width: 767px) {
  .manifest-content-wrap h2 {
    height: auto;
    padding: 15px;
  }
  .manifest-content-wrap h2 span {
    display: block;
  }
  .manifest-content-wrap h2 span.num {
    font-size: 38px;
    width: 50px;
    margin: 0 auto 4px;
    line-height: 1.1;
  }
  .manifest-content-wrap h2 span.title {
    font-size: 18px;
    text-align: center;
  }
}

.manifest-content-wrap h3 {
  margin: 20px auto;
  font-size: 120%;
  font-style: italic;
}

.manifest-content {
  width: 100%;
}

.manifest-content dt,
.manifest-content dd {
  font-size: 16px;
  line-height: 36px;
}

.manifest-content dt {
  width: 190px;
  float: left;
  color: #d52572;
  text-align: right;
  font-weight: bold;
  position: relative;
}

.manifest-content dt:before {
  content: url("./img/parts/pink-line.png");
  position: absolute;
  top: -5px;
  left: 0;
}

.manifest-content dd {
  width: 100%;
  padding-left: 210px;
}

@media screen and (max-width: 767px) {
  .manifest-content dt,
  .manifest-content dd {
    line-height: 1.6;
  }
  .manifest-content dt {
    position: static;
    width: 100%;
    float: none;
    text-align: left;
    font-size: 16px;
  }
  .manifest-content dt:before {
    position: static;
    content: "";
  }
  .manifest-content dd {
    padding-left: 0;
    margin-bottom: 15px;
    font-size: 14px;
  }
}

.manifest-images {
  display: flex;
  display: -ms-flex;
  display: -webkit-flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: center;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  margin-top: 20px;
  margin-bottom: 10px;
  align-items: flex-start;
}

.manifest-images img {
  display: inline-block;
  width: 25%;
}

@media screen and (max-width: 767px) {
  .manifest-images img {
    width: 50%;
  }
}

/* *********************************************
section : 会報など papers
********************************************* */
.pdf-links a {
  display: inline-block;
  position: relative;
  padding-left: 80px;
  text-decoration: underline;
  line-height: 36px;
  vertical-align: middle;
}

.pdf-links a:before {
  content: url("./img/parts/pdf.png");
  position: absolute;
  top: 5px;
  left: 0;
}

.papers {
  margin-bottom: 60px;
}

.papers .left-box,
.papers .right-box {
  width: 560px;
}

@media screen and (max-width: 767px) {
  .papers .left-box,
  .papers .right-box {
    width: 100%;
  }
}

.papers .left-box {
  float: left;
}

.papers .right-box {
  float: right;
}

.papers section {
  margin-bottom: 20px;
}

.poster-content .each-poster,
.election-content .each-poster {
  display: block;
  width: 30%;
  max-width: 170px;
}

.poster-content .each-poster .poster-image,
.election-content .each-poster .poster-image {
  width: 100%;
  margin-bottom: 10px;
  position: relative;
}

.poster-content .each-poster .poster-image:after,
.election-content .each-poster .poster-image:after {
  content: url("./img/parts/zoom.png");
  position: absolute;
  bottom: 3px;
  right: 3px;
}

.poster-content .each-poster .links,
.election-content .each-poster .links {
  text-decoration: underline;
  font-size: 14px;
}

/* *********************************************
section : 固定ページへのリンク other-pages
********************************************* */
.other-pages {
  width: 100%;
  background-color: #f8f7fb;
  padding: 80px 0 100px;
}

.other-pages .other-page-links {
  margin-bottom: 50px;
}

.other-pages .other-page-links a {
  display: block;
  width: 570px;
  margin: 0 auto 25px;
}

@media screen and (max-width: 767px) {
  .other-pages .other-page-links a {
    max-width: 100%;
  }
}

.matsuyama-song {
  padding: 20px 30px 20px 40px;
  background-color: #fff;
}

.matsuyama-song .intro {
  margin-bottom: 20px;
}

.matsuyama-song .left-box {
  max-width: 620px;
  margin-right: 40px;
  float: left;
}

.matsuyama-song .left-box .about-song {
  margin-bottom: 25px;
}

.matsuyama-song .left-box .song-images img {
  display: block;
}

@media screen and (max-width: 767px) {
  .matsuyama-song .left-box .song-images img {
    width: 90%;
  }
}

.matsuyama-song .left-box .song-images .img-seisakuehon {
  float: right;
  margin-top: -165px;
}

@media screen and (max-width: 767px) {
  .matsuyama-song .left-box .song-images .img-seisakuehon {
    margin-top: -60px;
  }
}

.matsuyama-song .right-box {
  width: calc(100% - 660px);
  float: right;
  padding-top: 40px;
}

@media screen and (max-width: 767px) {
  .matsuyama-song {
    padding: 0;
    width: calc(100% - 30px);
    margin-right: auto;
    margin-left: auto;
  }
  .matsuyama-song .h2-side-pink {
    height: auto;
    line-height: 1.2;
    font-size: 20px;
    padding-left: 20px;
  }
  .matsuyama-song .left-box,
  .matsuyama-song .right-box {
    float: none;
    width: 100%;
  }
}

.seisakuehon .seisakuehon-each {
  display: block;
}

.seisakuehon .seisakuehon-each p {
  text-align: center;
  font-size: 16px;
}

.lum-lightbox {
  z-index: 1000;
}

/* *********************************************
section : リンク LINKS
********************************************* */
.section-link {
  margin-bottom: 60px;
}

.section-link .sns-links {
  width: 560px;
  margin: 40px auto;
}

@media screen and (max-width: 767px) {
  .section-link .sns-links {
    margin: 20px auto 0;
  }
  .section-link .sns-links li {
    width: 30%;
  }
}

.section-link .other-links {
  width: 870px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .section-link .other-links li {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .section-link .sns-links,
  .section-link .other-links {
    width: 100%;
  }
}

@media screen and (max-width: 767px) and (max-width: 767px) {
  .section-link .sns-links li,
  .section-link .other-links li {
    text-align: center;
    margin-bottom: 20px;
  }
}

/* *********************************************
section : 後援会 SUPPORTER
********************************************* */
.section-support .support-top {
  width: 100%;
  height: 554px;
  background: url("./img/supporters-image.jpg") center center no-repeat;
  background-size: cover;
  position: relative;
}

.section-support .support-top .tile-front,
.section-support .support-top .tile-back {
  width: 400px;
  height: 164px;
  position: absolute;
}

.section-support .support-top .tile-front {
  background-color: #d52572;
  top: 195px;
  left: 50%;
  margin-left: -485px;
  text-align: center;
}

.section-support .support-top .tile-front span {
  color: #fff;
}

.section-support .support-top .tile-front span.title-ja {
  padding-top: 44px;
  line-height: 1.4;
}

.section-support .support-top .tile-front span.title-en {
  line-height: 3;
}

.section-support .support-top .tile-back {
  background-color: #f19ec2;
  top: 208px;
  left: 50%;
  margin-left: -472px;
}

@media screen and (max-width: 767px) {
  .section-support .support-top {
    height: 69vw;
    background: url("./img/sp/supporters-image_sp.jpg") top center no-repeat;
    background-size: contain;
  }
  .section-support .support-top .tile-front,
  .section-support .support-top .tile-back {
    width: 180px;
    height: 100px;
    position: absolute;
    margin-left: 0;
  }
  .section-support .support-top .tile-front {
    top: 40px;
    left: 20px;
  }
  .section-support .support-top .tile-front span.title-ja {
    padding-top: 22px;
    line-height: 1.3;
    font-size: 24px;
  }
  .section-support .support-top .tile-front span.title-en {
    line-height: 2;
  }
  .section-support .support-top .tile-back {
    top: 45px;
    left: 25px;
  }
}

.supporter-content {
  position: relative;
  z-index: 10;
  margin-top: -60px;
  padding: 40px 34px;
  box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.4);
  background-color: #fff;
}

.supporter-content p {
  margin-bottom: 1em;
}

.supporter-content .supporter-donation ul {
  margin: 30px 0 20px;
}

@media screen and (max-width: 767px) {
  .supporter-content {
    width: calc(100% - 30px);
    padding: 30px 15px;
    box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.2);
    margin-top: -40px;
  }
}

/* *********************************************
section : お問い合わせ CONTACT
********************************************* */
.ver-bar.contact {
  margin: 30px auto 10px;
}

.about-office {
  margin: 40px auto 40px;
  padding: 20px 25px;
  background-color: #f8f7fb;
  line-height: 1.8;
}

.about-office .left-box {
  width: 370px;
  float: left;
}

.about-office .right-box {
  width: 350px;
  float: right;
}

@media screen and (max-width: 767px) {
  .about-office .left-box,
  .about-office .right-box {
    float: none;
    width: 100%;
  }
}

.about-office h2 {
  color: #d52572;
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 10px;
}

.about-office .tel {
  font-size: 20px;
  color: #666;
  font-weight: bold;
  font-style: italic;
  margin: 6px 0;
}

/* *********************************************
section : お問い合わせフォーム CONTACT FORM
********************************************* */
.contactform {
  margin-bottom: 60px;
}

.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form textarea,
.contact-form select {
  width: 100%;
  margin-bottom: 20px;
  padding: 8px 20px;
  background-color: #eee;
  border: none;
  outline: none;
  vertical-align: middle;
  font-size: inherit;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.contact-form input[type="text"]:focus,
.contact-form input[type="email"]:focus,
.contact-form input[type="tel"]:focus,
.contact-form textarea:focus,
.contact-form select:focus {
  background-color: #fff;
  border: 1px solid #eee;
}

.mark-zipcode {
  display: inline-block;
  padding: 8px 0;
  margin-right: 10px;
  vertical-align: super;
  font-size: 18px;
}

.contact-form input.form-onamae,
.contact-form input.form-email,
.contact-form input.form-furigana {
  width: 400px;
}

@media screen and (max-width: 767px) {
  .contact-form input.form-onamae,
  .contact-form input.form-email,
  .contact-form input.form-furigana {
    width: 90%;
  }
}

.contact-form input.form-zipcode {
  display: inline-block;
  width: 160px;
}

.contact-form .wpcf7-form > p {
  margin-bottom: 10px;
}

.contact-form .wpcf7-form > p .form-label {
  display: inline-block;
  margin-bottom: 10px;
  font-weight: bold;
}

.contact-form .wpcf7-form .yoken {
  display: inline-block;
  margin-bottom: 18px;
}

.contact-form .wpcf7-form .yoken .form-yoken label {
  margin-right: 20px;
}

.contact-form .hissu {
  display: inline-block;
  padding: 0 10px;
  margin-left: 12px;
  border: 1px solid #d52572;
  border-radius: 3px;
  color: #d52572;
  font-size: 10px;
  text-align: center;
  line-height: 1.6;
}

.contact-form .form-submit {
  display: block;
  margin: 20px auto 40px;
  text-align: center;
}

.form-policy .form-label {
  font-weight: bold;
}

.form-policy .privacy-policy {
  width: 100%;
  border: 1px solid #eee;
  margin: 15px 0 25px;
  padding: 20px 30px;
  height: 200px;
  overflow: scroll;
}

.form-policy .privacy-policy p {
  margin-bottom: 10px;
}

.form-policy .privacy-policy h2 {
  color: #d52572;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 20px;
}

.form-policy .privacy-policy h3 {
  font-weight: bold;
}

.form-policy-agree {
  padding: 15px 25px;
  border: 2px solid #d52572;
  margin-bottom: 40px;
  line-height: 2.4;
}

.form-policy-agree .agree label input[type="checkbox"] {
  margin-right: 4px;
}

.form-policy-agree .agree label span {
  font-size: 15px;
  font-weight: bold;
}

.contact-form .form-submit input[type="submit"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  display: inline-block;
  width: 190px;
  height: 50px;
  margin: 0 10px;
  text-indent: -9999px;
  background-image: url("./img/buttons/button-submit.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-color: transparent;
}

/* *********************************************
section : footer
********************************************* */
.site-footer-wrap {
  border-top: 1px solid #bfbfbf;
  background-color: #f8f7fb;
}

.site-footer-wrap .copyrights {
  width: 100%;
  background-color: #333;
}

.site-footer-wrap .copyrights p {
  text-align: center;
  color: #fff;
  font-family: serif;
  font-size: 12px;
  line-height: 40px;
}

.site-footer {
  padding: 40px 0;
}

.site-footer .footer-navi {
  width: 740px;
  float: right;
}

.site-footer .footer-navi li {
  float: left;
}

.site-footer .footer-navi li a {
  padding: 0 18px;
  color: #282828;
}

.site-footer .footer-navi li:after {
  content: "|";
  font-weight: bold;
  color: #282828;
}

@media screen and (max-width: 767px) {
  .site-footer .footer-navi li:after {
    content: "";
  }
}

.site-footer .footer-navi li:first-child a {
  padding-left: 0;
}

.site-footer .footer-navi li:last-child:after {
  content: "";
}

.site-footer .footer-navi li:last-child a {
  padding-right: 0;
}

@media screen and (max-width: 767px) {
  .site-footer {
    padding: 0;
  }
  .site-footer .footer-navi {
    width: 100%;
    float: none;
  }
  .site-footer .footer-navi li {
    width: 50%;
    border-bottom: 2px solid #ccc;
  }
  .site-footer .footer-navi li:nth-child(odd) {
    border-right: 2px solid #ccc;
  }
  .site-footer .footer-navi li:last-child {
    width: 100%;
    border-right: none;
  }
  .site-footer .footer-navi li:first-child a {
    padding-left: 8px;
  }
  .site-footer .footer-navi li a {
    display: block;
    padding: 12px 8px;
  }
  .site-footer .footer-navi li a:before {
    content: ">";
    margin-right: 3px;
  }
}

.site-footer .site-title {
  width: 200px;
  float: left;
  color: #666;
}

.site-footer .site-title .sup {
  display: block;
  font-size: 16px;
}

.site-footer .site-title .name-ishii {
  display: block;
  font-size: 28px;
}

@media screen and (max-width: 767px) {
  .site-footer .site-title {
    float: none;
    width: 100%;
    line-height: 1.2;
  }
}

.to-top {
  display: block;
  width: 40px;
  height: 40px;
  position: fixed;
  bottom: 10px;
  right: 10px;
  cursor: pointer;
}

.to-top img {
  display: block;
  opacity: 0.6;
}

/* *********************************************
section : report 政務活動報告
********************************************* */
/* シングル・アーカイブ共通 */
.report-header {
  width: 100%;
  height: 350px;
  background: #d52572;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
     -ms-flex-pack: justify;
   justify-content: space-between;
   -webkit-box-align: center;
   -ms-flex-align: center;
      align-items: center;
}

.report-header h1 {
  width: 40%;
  padding: 0 40px;
  line-height: 60px;
  font-size: 36px;
  font-weight: 500;
  color: #fff;
}
.report-header .report-header-eyecatch {
  width: 60%;
  height: 350px;
  background: url(./img/report-image.jpg) right center no-repeat ;
  background-size: cover;
}

.report-header.ouen-page {
  background-image: url(./img/fanpage-image.jpg);
}

.report-header.ouen-page h1 {
  line-height: inherit;
  display: inline-block;
  margin-top: 100px;
}

@media screen and (max-width: 767px) {
  .report-header {
    background: url(./img/sp/report-image_sp.jpg) right top no-repeat #d52572;
    background-size: cover;
    height: 60vw;
    display: block;
  }
  .report-header h1 {
    width: 100%;
    line-height: 40px;
    /* text-indent: -150px; */
    font-size: 28px;
    padding: 32vw 20px 0;
  }
  .report-header .report-header-eyecatch {
    display: none;
  }
  .report-header.ouen-page {
    position: relative;
    background-image: url(./img/fanpage-image_sp.jpg);
  }
  .report-header.ouen-page h1 {
    line-height: inherit;
    display: inline-block;
    margin-top: 1px;
    text-indent: 0;
    position: absolute;
    left: 0;
    font-size: 26px;
  }
}

.bread {
  width: 100%;
  background: #f8f7fb;
  height: 60px;
  padding: 20px 20px 24px;
}

.bread span,
.bread a {
  display: inline-block;
  margin: 0 8px;
}

.bread span:first-child,
.bread a:first-child {
  margin-left: 0;
}

.bread span:last-child,
.bread a:last-child {
  margin-right: 0;
}

.bread a {
  color: inherit;
}

@media screen and (max-width: 767px) {
  .bread {
    height: auto;
    padding: 13px 15px 16px;
    font-size: 12px;
  }
}

.report-post {
  width: 920px;
  margin: 60px auto;
}

.report-post .report-posthead {
  margin-bottom: 20px;
}

.report-post .report-posthead h2.h2-side-pink {
  margin-bottom: 10px;
}

.report-post .report-posthead .post-date {
  font-style: italic;
  color: #999;
}

/* ここから　2021/4/19 修正 */
.report-post .report-eyecatch {
  margin: 40px 0;
  text-align: center;
}

/* ここまで　2021/4/19 修正 */

.report-post .report-body {
  margin-bottom: 60px;
}

.report-post .report-body div,
.report-post .report-body p,
.report-post .report-body img {
  max-width: 100%;
}

.report-post .other-posts {
  width: 100%;
  background: #f8f7fb;
  height: 80px;
  padding: 26px 10px;
}

.report-post .other-posts .prev-post,
.report-post .other-posts .next-post {
  width: 100px;
  height: 20px;
}

.report-post .other-posts .prev-post a,
.report-post .other-posts .next-post a {
  color: #d52572;
  font-size: 16px;
}

.report-post .other-posts .prev-post {
  float: left;
}

.report-post .other-posts .next-post {
  float: right;
  text-align: right;
}

@media screen and (max-width: 767px) {
  .report-post {
    width: 100%;
    margin: 30px auto;
  }
  .report-post .other-posts {
    height: 50px;
    padding: 14px 10px 8px;
  }
  .report-post .other-posts .prev-post a,
  .report-post .other-posts .next-post a {
    font-size: 13px;
  }
  .report-post .report-posthead h2.h2-side-pink {
    height: auto;
    padding: 10px 10px 10px 16px;
    font-size: 20px;
    line-height: 25px;
  }
}

/* シングルページ */
/* アーカイブページ */
.report-post-list {
  margin: 60px auto;
}

.post-type-archive-report .report-post-list article {
  margin-right: 20px;
}

.report-post-list article {
  width: 270px;
  margin-bottom: 40px;
}

.report-post-list article .post-thumbnail {
  height: 200px;
}

.report-post-list article .post-date {
  font-style: italic;
  color: #999;
}

.report-post-list article h2 {
  color: #333;
  font-size: 15px;
}

@media screen and (max-width: 767px) {
  .report-post-list {
    margin: 40px auto;
  }
  .post-type-archive-report .report-post-list article {
    margin: 1%;
  }
  .report-post-list article {
    width: 48%;
  }
  .report-post-list article .post-thumbnail {
    height: 33vw;
  }
  .report-post-list article h2 {
    font-size: 13px;
  }
}

.pagenation-wrap {
  margin: 40px auto;
}

.pagenation-wrap .pagination {
  text-align: center;
}

.pagenation-wrap .pagination .page-numbers li {
  display: inline-block;
}

.pagenation-wrap .pagination .page-numbers li a,
.pagenation-wrap .pagination .page-numbers li span {
  display: inline-block;
  width: 50px;
  height: 50px;
  margin: 0 4px;
  background: #f8f7fb;
  color: #333;
  line-height: 50px;
  font-size: 16px;
}

.pagenation-wrap .pagination .page-numbers li a.current,
.pagenation-wrap .pagination .page-numbers li span.current {
  background: #d52572;
  color: #fff;
}

@media screen and (max-width: 767px) {
  .pagenation-wrap .pagination .page-numbers li a,
  .pagenation-wrap .pagination .page-numbers li span {
    width: 28px;
    height: 28px;
    margin: 0 3px;
    font-size: 13px;
    line-height: 28px;
  }
}

/* *********************************************
section : fanpage : 応援ページ
********************************************* */
#FANPAGE {
  margin: 60px auto;
}

@media screen and (max-width: 767px) {
  #FANPAGE {
    margin: 30px auto 40px;
  }
}

#FANPAGE h2,
#FANPAGE h3,
#FANPAGE h4 {
  font-weight: bold;
  margin-bottom: 20px;
}

#FANPAGE h2 {
  height: 50px;
  line-height: 50px;
  margin: 50px 0 20px;
  padding-left: 24px;
  border-left: 5px solid #d52572;
  font-size: 24px;
}

#FANPAGE h2:first-child {
  margin-top: 0;
}

#FANPAGE h3 {
  position: relative;
  padding: 20px 0 10px;
  line-height: 1;
  font-size: 18px;
  color: inherit;
  border-bottom: 2px solid #bfbfbf;
}

#FANPAGE h3:after {
  content: url("./img/parts/h2-prof-border.png");
  position: absolute;
  bottom: -5px;
  left: 0;
}

#FANPAGE h4 {
  font-size: 16px;
  margin-bottom: 10px;
}

@media screen and (max-width: 767px) {
  #FANPAGE h2 {
    padding-left: 18px;
    font-size: 20px;
    line-height: 30px;
    padding-top: 11px;
    min-height: 50px;
    height: auto;
  }
  #FANPAGE h3 {
    font-size: 16px;
  }
  #FANPAGE h4 {
    font-size: 14px;
  }
}

#FANPAGE p {
  margin-bottom: 1em;
}

#FANPAGE ul {
  margin-bottom: 1em;
}

#FANPAGE ul li {
  text-indent: -1em;
  padding-left: 1em;
}

#FANPAGE ul li:before {
  content: "■";
  margin-right: 5px;
  color: #d52572;
  font-size: 8px;
}

#FANPAGE a {
  text-decoration: underline;
}

#FANPAGE a:hover {
  text-decoration: none;
}

#FANPAGE a.outbound-link,
#FANPAGE a.pdf-link {
  display: inline-block;
  position: relative;
}

#FANPAGE a.outbound-link:after {
  content: url(./img/parts/outbound-gray.png);
  display: block;
  width: 16px;
  height: 14px;
  position: absolute;
  right: -20px;
  top: 3px;
}

#FANPAGE a.pdf-link {
  padding-left: 50px;
}

#FANPAGE a.pdf-link:before {
  content: url(./img/parts/pdf-link.png);
  width: 46px;
  height: 20px;
  position: absolute;
  left: 0;
  top: 2px;
}

/* *********************************************
section : gallery : ギャラリーページ
********************************************* */
.gallary-page {
  margin: 60px auto;
}

.gallary-page .gallery-item {
  width: 24%;
}

.gallary-page .gallery-item a {
  display: block;
  margin-bottom: 30px;
}

.gallary-page .gallery-item a .caption {
  color: #333;
}

@media screen and (max-width: 767px) {
  .gallary-page {
    margin: 40px auto;
  }
  .gallary-page .gallery-item {
    width: 48%;
  }
}

/* *********************************************
section : 404 : 404ページ
********************************************* */
.page-404 {
  height: calc(100vh - 195px);
  padding: 240px 100px;
  text-align: center;
}

.page-404 h1 {
  font-size: 100px;
  font-weight: 600;
  color: #888;
}

.page-404 p {
  font-size: 18px;
  color: #666;
  margin: 20px auto;
}

@media screen and (max-width: 767px) {
  .page-404 {
    height: auto;
    padding: 100px 30px 120px;
  }
  .page-404 h1 {
    font-size: 40px;
  }
  .page-404 p {
    font-size: 15px;
  }
}

/* *********************************************
その他調整 2021/03/28
********************************************* */
@media screen and (max-width: 1160px) {
  .prof-content-wrap.sp-box {
    padding-left: 1%;
    padding-right: 1%;
  }
}


/* *********************************************
　画像：inserted-images
********************************************* */
.inserted-images {
  margin-bottom: 40px;
}

.inserted-images >div {
  position: relative;
}

.inserted-images >div img {
  display: block;
}

.inserted-images >div figcaption {
  position: absolute;
  display: block;
  width: 100%;
  height: auto;
  padding: 10px;
  left: 0;
  bottom: 0;
  background: rgba( 0,0,0, .5);
  color: #fff;
}

/* *********************************************
　国民民主党バナー
********************************************* */
.kokumin-banner {
  max-width: 920px;
  text-align: center;
  margin: 20px auto 40px;
}

.link-kokumin-banner {
}

/* ****************** MOVIEセクション ******************* */
.section-movie {
  margin: 100px auto;
   padding-bottom: 0;
}

.video-slider {
    width: 100%;
    max-width: 900px;
    margin: 0 auto 20px;
    position: relative;
    overflow: hidden;
}
.video-slider::before{
    padding-top: 56.25%;
    display: block;
    content: "";
}
.video-slider iframe{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.video-slider-nav.slick-initialized.slick-slider {
  width: 78%;
  margin: 10px auto 0;
}

.video-slider-nav .slick-prev, .video-slider-nav .slick-next {
  background-repeat: no-repeat;
  background-color: transparent;
  background-size: 31px;
  background-position: center center;
  cursor: pointer;
  z-index: 100;
}

.video-slider-nav .slick-prev {
  background-image: url(img/button-prev.png);
  left: -5%;
}

.video-slider-nav .slick-next {
  background-image: url(img/button-next.png);
  right: -5%;
}

.video-slider-nav .video-slider-nav-item.slick-slide {
  position: relative;
  margin: 0 4px;
  cursor: pointer;
  height: auto;
}

.video-slider-nav .video-slider-nav-item.slick-slide:after {
  display: block;
  content: " ";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.4);
}

.video-slider-nav .video-slider-nav-item.slick-slide:hover, .video-slider-nav .video-slider-nav-item.slick-slide.slick-current {
  display: block;
}

.video-slider-nav .video-slider-nav-item.slick-slide:hover:after, .video-slider-nav .video-slider-nav-item.slick-slide.slick-current:after {
  background: transparent;
}

.slick-prev, .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 31px;
    height: 31px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    /* cursor: pointer; */
    /* color: transparent; */
    border: none;
    outline: none;
    background: transparent;
}

.mute-button {
  display: none;
}

@media screen and ( max-width: 767px ) {
  .section-movie {
    margin: 50px auto;
  }
  .video-slider-nav .slick-prev {
    left: -12%;
  }
  .video-slider-nav .slick-next {
    right: -12%;
  }

  .video-slider {
      margin-bottom: 10px;
  }

  .mute-button {
      display: block;
      width: 48px;
      height: 48px;
      background-image: url( img/icons/unmuted.svg);
      background-position: center center;
      background-repeat: no-repeat;
      background-size: contain;
      margin: 0 auto;
      /* position: absolute;
      top: 60px;
      right: 20px; */
    }
    .mute-button.muted {
        background-image: url( img/icons/muted.svg);

    }


  /* .yu-unmute {
    display: block;
    width: 150px;
    height: 30px;
    line-height: 30px;
    background-color: #d52572;
    border-radius: 15px;
    margin: 10px auto;
    text-align: center;
    color: #fff;
  } */
}