@charset "UTF-8";
/* --------------------------------------
Public
----------------------------------------- */
html, 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, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

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

ul, li {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

body {
  margin: 0;
  padding: 0;
  font-family: "YuGothic", "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
  color: #000;
}

/* --------------------------------------
pc_header sp_header
----------------------------------------- */
#pc_header,
#sp_header {
  position: relative;
  z-index: 20;
}

#pc_header {
  position: relative;
  z-index: 999999;
  width: 100%;
  height: 61px;
  background: url(bg.png) top center no-repeat #000;
}
#pc_header > div {
  position: relative;
  width: 100%;
  max-width: 1000px;
  height: 61px;
  margin: 0 auto;
  background: url(nbo.jpg) top left no-repeat;
}
#pc_header > div .nbo_header {
  position: absolute;
  width: 283px;
  height: 35px;
  top: 11px;
  right: 12px;
  overflow: hidden;
}
#pc_header > div .nbo_header img {
  display: block;
  position: absolute;
  top: -11px;
  right: -12px;
}

#sp_header {
  display: none;
  position: relative;
  z-index: 99999999;
  width: 100%;
  height: 30px;
  padding: 5px 0;
  background: #000;
}
#sp_header a {
  display: block;
  width: 92px;
  margin: 0 auto;
}
#sp_header a img {
  display: block;
}

@media screen and (max-width: 640px) {
  #pc_header {
    display: none;
  }
  #sp_header {
    display: block;
  }
}
@media screen and (min-width: 1000px) {
  .ttl_small {
    font-size: 22px !important;
  }
  .ttl_smalls {
    font-size: 16px !important;
  }
  .ttl_small_pc {
    font-size: 18px !important;
  }
  .pc_mb_0 {
    margin-bottom: 0 !important;
  }
  .pc_mt_70 {
    margin-top: 70px !important;
  }
}
@media screen and (max-width: 640px) {
  .ttl_small {
    font-size: 14px !important;
  }
  .ttl_smalls {
    font-size: 10px !important;
  }
  .sp_small {
    font-size: 10px !important;
  }
  #pc_header {
    display: none;
  }
  #sp_header {
    display: block;
  }
}
#footerArea {
  position: relative;
  z-index: 99;
  padding-bottom: 60px;
  background-color: #ffffff;
}

/* --------------------------------------
SP public
----------------------------------------- */
@media screen\0  {
  #content {
    font-family: "メイリオ", Meiryo, sans-serif;
  }
}
img {
  height: auto;
}

.topAnimation {
  overflow: hidden;
  position: fixed;
  top: 0;
  z-index: 9999999999999;
  width: 100%;
  height: 100vh;
  background-color: #000;
}
.topAnimation ul {
  display: flex;
  flex-wrap: wrap;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  width: 235px;
  margin: 0 auto;
}
.topAnimation ul li {
  transform: translateX(-300%);
  transition-duration: 0.3s;
  transition-timing-function: ease-in;
  opacity: 0;
}
.topAnimation ul li img {
  width: auto;
  height: 24px;
}
.topAnimation ul li:nth-of-type(16) {
  transition-delay: 0.1s;
}
.topAnimation ul li:nth-of-type(15) {
  transition-delay: 0.15s;
}
.topAnimation ul li:nth-of-type(14) {
  transition-delay: 0.2s;
}
.topAnimation ul li:nth-of-type(13) {
  transition-delay: 0.25s;
}
.topAnimation ul li:nth-of-type(12) {
  transition-delay: 0.3s;
}
.topAnimation ul li:nth-of-type(11) {
  transition-delay: 0.35s;
}
.topAnimation ul li:nth-of-type(10) {
  transition-delay: 0.4s;
}
.topAnimation ul li:nth-of-type(9) {
  transition-delay: 0.45s;
}
.topAnimation ul li:nth-of-type(8) {
  margin: 0 1em 0 0;
  transition-delay: 0.5s;
}
.topAnimation ul li:nth-of-type(7) {
  transition-delay: 0.55s;
}
.topAnimation ul li:nth-of-type(6) {
  transition-delay: 0.6s;
}
.topAnimation ul li:nth-of-type(5) {
  transition-delay: 0.65s;
}
.topAnimation ul li:nth-of-type(4) {
  transition-delay: 0.7s;
}
.topAnimation ul li:nth-of-type(3) {
  transition-delay: 0.75s;
}
.topAnimation ul li:nth-of-type(2) {
  transition-delay: 0.8s;
}
.topAnimation ul li:nth-of-type(1) {
  transition-delay: 0.85s;
}
.topAnimation.fadein li {
  opacity: 1;
  transform: none;
}

.open {
  /* navListBox */
}
.open .navListBox {
  /* hamburger */
}
.open .navListBox .hamburger span:nth-child(1) {
  transform: translate(0, 5px) rotate(45deg);
}
.open .navListBox .hamburger span:nth-child(2) {
  opacity: 0;
  transform: translate(-20px, 0);
}
.open .navListBox .hamburger span:nth-child(3) {
  transform: translate(0, -5px) rotate(-45deg);
}
.open .navListBox nav {
  right: 0 !important;
}

/* open */
.wrapper {
  padding: 0 0 80px 0;
  border-bottom: solid 1px #aaa;
  background-color: #000;
  font-weight: 500;
  font-family: "YuGothic", "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
  font-weight: 500;
  /* ==================
   navListBox
   ===================== */
  /* navListBox */
  /* ==================
  indexPage
  ===================== */
  /* indexPage */
  /* ==================
  article
  ===================== */
  /* article */
  /* ==================
  article p1
  ===================== */
  /* p1 */
  /* ==================
  article p2
  ===================== */
  /* p2 */
  /* ==================
  article-5
  ===================== */
  /* ==================
  article-4
  ===================== */
  /* ==================
  article-3
  ===================== */
  /* ==================
  article-1
  ===================== */
  /* ==================
  article-2
  ===================== */
  /* ==================
  article-6
  ===================== */
  /* ==================
  article-7
  ===================== */
  /* article-7 */
  /* ==================
  article-8
  ===================== */
  /* article-8 */
  /* ==================
  article-9
  ===================== */
  /* article-9 */
  /* ==================
   article-10
   ===================== */
  /* article-10 */
  /* ==================
   article-11
   ===================== */
  /* article-11 */
  /* ==================
  article-12
  ===================== */
  /* article-12 */
  /* ==================
  article-13
  ===================== */
  /* article-13 */
  /* ==================
  article-14
  ===================== */
  /* article-14 */
  /* ==================
  article-15
  ===================== */
  /* article-15 */
  /* ==================
  article-16
  ===================== */
  /* article-16 */
  /* ==================
  article-17
  ===================== */
  /* ==================
  article-18
  ===================== */
  /* ==================
  article-19
  ===================== */
  /* ==================
  article-20
  ===================== */
  /* ==================
  article-21
  ===================== */
  /* ==================
  article-22
  ===================== */
  /* ==================
  article-23
  ===================== */
  /* ==================
  article-24
  ===================== */
  /* ==================
  article-25
  ===================== */
  /* ==================
  article-26
  ===================== */
  /* ==================
  article-27
  ===================== */
  /* ==================
  article-28
  ===================== */
  /* ==================
  article-29
  ===================== */
  /* ==================
  article-30
  ===================== */
  /* ==================
  article-31
  ===================== */
  /* ==================
  thema
  ===================== */
}
.wrapper .only_sp {
  display: block;
}
.wrapper .only_pc {
  display: none;
}
.wrapper img {
  width: 100%;
}
.wrapper .navListBox {
  /* navBar */
  /* nav */
}
.wrapper .navListBox .navBar {
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 99999;
  width: 100%;
  height: 70px;
  background-color: #006ea7;
  /* hamburger */
  /* snsList */
  /* linkList */
  /* keyframes */
  /* keyframes */
}
.wrapper .navListBox .navBar .hamburger {
  display: block;
  position: absolute;
  z-index: 1003;
  top: 15px;
  right: 15px;
  overflow: hidden;
  margin: 0 auto 0 auto;
  padding: 14px 2px 6px 2px;
  box-sizing: border-box;
  border: 1px solid #ffffff;
  border-radius: 100px;
  width: 40px;
  height: 40px;
  transition: 0.5s;
  cursor: pointer;
}
.wrapper .navListBox .navBar .hamburger span {
  display: block;
  margin: 0 auto 4px auto;
  width: 18px;
  height: 1px;
  background: #fff;
  transition: 0.3s;
}
.wrapper .navListBox .navBar .hamburger span:last-of-type {
  margin-bottom: 0;
}
.wrapper .navListBox .navBar .snsList {
  display: flex;
  justify-content: space-between;
  position: absolute;
  top: 8px;
  right: 70px;
  width: 132px;
}
.wrapper .navListBox .navBar .snsList li {
  margin: 15px 0 0 0;
  z-index: 9999;
}
.wrapper .navListBox .navBar .snsList li a {
  margin: 0 auto 0 auto;
  display: block;
  width: 40px;
}
.wrapper .navListBox .navBar .snsList p {
  font-size: 9px;
  color: #fff;
  position: absolute;
  top: 0;
  bottom: 0px;
  text-align: center;
  width: 132px;
}
.wrapper .navListBox .navBar .linkList {
  display: flex;
  justify-content: space-between;
  position: absolute;
  top: 8px;
  left: 2%;
  width: 180px;
}
.wrapper .navListBox .navBar .linkList li {
  display: none;
}
.wrapper .navListBox .navBar .linkList li:first-child {
  display: block;
}
.wrapper .navListBox .navBar .linkList li:first-child a {
  width: 110px;
  padding-left: 10px;
  padding-top: 12px;
}
.wrapper .navListBox .navBar .linkList li a {
  margin: 0 auto 0 auto;
  display: block;
  width: 40px;
  position: relative;
  padding-bottom: 10px;
}
.wrapper .navListBox .navBar .linkList li a p {
  font-size: 10px;
  transform: scale(0.6);
  color: #fff;
  position: absolute;
  bottom: 0;
  left: calc(50% - 29px);
  text-align: center;
  width: 6em;
  display: block;
  white-space: nowrap;
}
.wrapper .navListBox .navBar .linkList li:last-child a {
  width: 85px;
  margin-left: 5px;
}
.wrapper .navListBox .navBar .lineAnimation {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999999;
  margin: 0 auto;
  width: 40px;
  transition: 0.5s;
}
.wrapper .navListBox .navBar .lineAnimation .line {
  display: block;
  position: relative;
  margin: 0 auto;
  width: 40px;
  height: 60px;
  transition: opacity 0.7s ease-out;
  -webkit-transition: opacity 0.7s ease-out;
  transition-delay: 0.4s;
  opacity: 1;
}
.wrapper .navListBox .navBar .lineAnimation .line > span {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 1px;
  height: 100%;
  transform: scaleY(0);
  -webkit-transform: scaleY(0);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  animation: scroll-bar 2.5s cubic-bezier(0.075, 0.82, 0.165, 1) infinite forwards;
  -webkit-animation: scroll-bar 2.5s cubic-bezier(0.075, 0.82, 0.165, 1) infinite forwards;
  background-color: #f5f5f5;
  pointer-events: none;
}
@keyframes scroll-bar {
  0% {
    transform: scaleY(0);
    transform-origin: top left;
  }
  50% {
    transform: scaleY(1);
    transform-origin: top left;
  }
  75% {
    transform: scaleY(1);
    transform-origin: bottom left;
  }
  100% {
    transform: scaleY(0);
    transform-origin: bottom left;
  }
}
.wrapper .navListBox nav {
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  transition: all 0.5s cubic-bezier(1, 0, 0, 1);
  position: fixed;
  top: 0px;
  right: -100%;
  z-index: 9999;
  padding: 50px 43px 80px 0;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  background: #000;
  text-align: left;
  color: #fff;
}
.wrapper .navListBox nav h2 {
  position: relative;
  margin: 0 0 30px 0;
  padding: 0 0 5px 0;
  width: 95%;
}
.wrapper .navListBox nav h2:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: #002060;
  background: linear-gradient(to right, #002060 0%, #00b0f0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#002060", endColorstr="#00b0f0",GradientType=1 );
}
.wrapper .navListBox nav h2 span {
  display: block;
  padding: 0 0 0 15px;
}
.wrapper .navListBox nav h2 span svg {
  width: auto;
  height: 25px;
}
.wrapper .navListBox nav h2.si {
  margin-top: 40px;
}
.wrapper .navListBox nav h2.si span img {
  width: auto;
  height: 25px;
}
.wrapper .navListBox nav ul {
  margin: 0 0 20px 0;
  /* li */
}
.wrapper .navListBox nav ul li {
  position: relative;
  padding: 0;
  /* a */
  /* sp-1 */
  /* sp-2 */
  /* sp-3 */
  /* sp-4 */
  /* article-31 */
  /* article-30 */
  /* article-29 */
  /* article-28 */
  /* article-27 */
  /* article-26 */
  /* article-25 */
  /* article-24 */
  /* article-23 */
  /* article-22 */
  /* article-21 */
  /* article-20 */
  /* article-19 */
  /* article-18 */
  /* article-17 */
  /* article-16 */
  /* article-15 */
  /* article-14 */
  /* article-13 */
  /* article-12 */
  /* article-11 */
  /* article-10 */
  /* article-9 */
  /* article-8 */
  /* article-7 */
  /* article-6 */
  /* article-5 */
  /* article-4 */
  /* article-3 */
  /* article-1 */
  /* article-3 */
}
.wrapper .navListBox nav ul li.current {
  background-color: #666;
}
.wrapper .navListBox nav ul li a {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0% 8px 5%;
  text-decoration: none;
  line-height: 1.5;
  color: #fff;
}
.wrapper .navListBox nav ul li a .photo {
  display: block;
  width: 32%;
  height: 50px;
  margin-right: 5px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.wrapper .navListBox nav ul li a p {
  width: 65%;
  font-weight: bold;
  font-size: 2.5vw;
  color: #fff;
}
.wrapper .navListBox nav ul li a p span {
  display: table;
  margin: 0 0 8px 0;
  font-size: 11px;
}
.wrapper .navListBox nav ul li a span {
  margin-right: 1em;
}
.wrapper .navListBox nav ul li.sp-1 a .photo {
  background-image: url(hdimg-1.jpg);
}
.wrapper .navListBox nav ul li.sp-2 a .photo {
  background-image: url(hdimg-2.jpg);
}
.wrapper .navListBox nav ul li.sp-3 a .photo {
  background-image: url(hdimg-3.jpg);
}
.wrapper .navListBox nav ul li.sp-4 a .photo {
  background-image: url(hdimg-4.jpg);
}
.wrapper .navListBox nav ul li.article-31 a .photo {
  background-image: url(article31_main.jpg?1217);
}
.wrapper .navListBox nav ul li.article-30 a .photo {
  background-image: url(article30_main.jpg?1219);
}
.wrapper .navListBox nav ul li.article-29 a .photo {
  background-image: url(article29_main.jpg?0731);
}
.wrapper .navListBox nav ul li.article-28 a .photo {
  background-image: url(article28_main.jpg?0607);
}
.wrapper .navListBox nav ul li.article-27 a .photo {
  background-image: url(article27_main.jpg?0809);
}
.wrapper .navListBox nav ul li.article-26 a .photo {
  background-image: url(article26_main.jpg?0706);
}
.wrapper .navListBox nav ul li.article-25 a .photo {
  background-image: url(article25_main.jpg);
}
.wrapper .navListBox nav ul li.article-24 a .photo {
  background-image: url(article24_main.jpg);
}
.wrapper .navListBox nav ul li.article-23 a .photo {
  background-image: url(article23_main.jpg);
}
.wrapper .navListBox nav ul li.article-22 a .photo {
  background-image: url(article22_main.jpg?0116);
}
.wrapper .navListBox nav ul li.article-21 a .photo {
  background-image: url(article21_main.jpg?1222);
}
.wrapper .navListBox nav ul li.article-20 a .photo {
  background-image: url(article20_main.jpg?1205_2);
}
.wrapper .navListBox nav ul li.article-19 a .photo {
  background-image: url(article19_main.jpg?1008);
}
.wrapper .navListBox nav ul li.article-18 a .photo {
  background-image: url(article18_main.jpg?0922);
}
.wrapper .navListBox nav ul li.article-17 a .photo {
  background-image: url(article17_main.jpg?0810);
}
.wrapper .navListBox nav ul li.article-16 a .photo {
  background-image: url(article16_main.jpg);
}
.wrapper .navListBox nav ul li.article-15 a .photo {
  background-image: url(article15_main.jpg?060701);
}
.wrapper .navListBox nav ul li.article-14 a .photo {
  background-image: url(article14_main.jpg?060701);
}
.wrapper .navListBox nav ul li.article-13 a .photo {
  background-image: url(article13_main.jpg);
}
.wrapper .navListBox nav ul li.article-12 a .photo {
  background-image: url(article12_main.jpg?0309);
}
.wrapper .navListBox nav ul li.article-11 a .photo {
  background-image: url(article11_main.jpg);
}
.wrapper .navListBox nav ul li.article-10 a .photo {
  background-image: url(article10_main.jpg);
}
.wrapper .navListBox nav ul li.article-9 a .photo {
  background-image: url(article9_main.jpg);
}
.wrapper .navListBox nav ul li.article-8 a .photo {
  background-image: url(article8_main.jpg);
}
.wrapper .navListBox nav ul li.article-7 a .photo {
  background-image: url(article7_main.jpg);
}
.wrapper .navListBox nav ul li.article-6 a .photo {
  background-image: url(article6_main.jpg);
  background-size: 120%;
  background-position: top right;
}
.wrapper .navListBox nav ul li.article-5 a .photo {
  background-image: url(article5_main.jpg);
}
.wrapper .navListBox nav ul li.article-4 a .photo {
  background-image: url(article4_main.jpg);
}
.wrapper .navListBox nav ul li.article-3 a .photo {
  background-image: url(article3_main.jpg);
}
.wrapper .navListBox nav ul li.article-1 a .photo {
  background-image: url(article1_main.jpg);
}
.wrapper .navListBox nav ul li.article-2 a .photo {
  background-image: url(article2_main.jpg);
}
.wrapper .navListBox nav .indexLink {
  margin: 0 auto;
  width: 90%;
}
.wrapper .navListBox nav .indexLink a {
  display: block;
  font-weight: bold;
  font-size: 18px;
  color: #ffffff;
}
.wrapper .navListBox nav .linkList {
  width: auto;
  display: flex;
  align-items: center;
  align-items: stretch;
  width: 100%;
  margin-bottom: 40px;
  margin-top: 20px;
}
.wrapper .navListBox nav .linkList li {
  display: block;
  margin-left: 6px;
}
.wrapper .navListBox nav .linkList li a {
  text-decoration: none;
  display: block;
}
.wrapper .navListBox nav .linkList li a img {
  width: auto;
  height: 9vw;
}
.wrapper.indexPage {
  /* hdArea */
  /* spissueArea */
  /* contentArea */
  /* thema */
}
.wrapper.indexPage .hdArea {
  position: relative;
  margin: 0 0 30px 0;
  padding: 0 0 30px 0;
  width: 100%;
  /* textArea */
  /* newContents */
}
.wrapper.indexPage .hdArea .mainImg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(hd_ph-1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center right 10%;
}
.wrapper.indexPage .hdArea .mainImg:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  background: linear-gradient(to right, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#99000000", endColorstr="#1a000000",GradientType=1 );
}
.wrapper.indexPage .hdArea .inner {
  position: relative;
  z-index: 99;
  margin: 0 auto;
  width: 90%;
  height: 100%;
}
.wrapper.indexPage .hdArea .inner .hd_logo {
  display: block;
  position: absolute;
  top: 2%;
  right: 0;
  background-color: #000;
  padding: 12px;
  width: min(22vw, 120px);
}
.wrapper.indexPage .hdArea .inner .hd_logo img {
  width: 100%;
  height: auto;
  display: block;
}
.wrapper.indexPage .hdArea h1 {
  padding: 15px 0 0 0;
}
.wrapper.indexPage .hdArea h1 a {
  text-decoration: none;
}
.wrapper.indexPage .hdArea h1 img {
  display: block;
  width: auto;
  height: min(27vw, 200px);
}
.wrapper.indexPage .hdArea .textArea {
  margin: 0 auto 20px 0;
  padding: 10px 0 0 0;
}
.wrapper.indexPage .hdArea .textArea .lead {
  line-height: 1.7;
  font-weight: bold;
  font-size: 13px;
  color: #ffffff;
}
.wrapper.indexPage .hdArea .newContents {
  position: relative;
  margin: 0 auto 0 0;
}
.wrapper.indexPage .hdArea .newContents h2 {
  background: #00b0f0;
  background: linear-gradient(to right, rgb(0, 176, 240), transparent);
  display: inline-block;
  position: relative;
  padding: 5px 80px 5px 5px;
  line-height: 1;
  font-size: 14px;
  color: #ffffff;
}
.wrapper.indexPage .hdArea .newContents a {
  display: block;
  text-decoration: none;
  line-height: 1.72;
  font-size: 11px;
  color: #ffffff;
  display: flex;
  justify-content: space-between;
  position: relative;
}
.wrapper.indexPage .hdArea .newContents a .photo {
  width: 40%;
  height: 25.9vw;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.wrapper.indexPage .hdArea .newContents a .photo.p31 {
  background-image: url(article31_main.jpg?1217);
}
.wrapper.indexPage .hdArea .newContents a .photo.p30 {
  background-image: url(article30_main.jpg?1219);
}
.wrapper.indexPage .hdArea .newContents a .photo.p29 {
  background-image: url(article29_main.jpg?0731);
}
.wrapper.indexPage .hdArea .newContents a .photo.p28 {
  background-image: url(article28_main.jpg?0607);
}
.wrapper.indexPage .hdArea .newContents a .photo.p27 {
  background-image: url(article27_main.jpg?0809);
}
.wrapper.indexPage .hdArea .newContents a .photo.p26 {
  background-image: url(article26_main.jpg?0706);
}
.wrapper.indexPage .hdArea .newContents a .photo.p25 {
  background-image: url(article25_main.jpg);
}
.wrapper.indexPage .hdArea .newContents a .photo.p24 {
  background-image: url(article24_main.jpg);
}
.wrapper.indexPage .hdArea .newContents a .photo.p23 {
  background-image: url(article23_main.jpg);
}
.wrapper.indexPage .hdArea .newContents a .photo.p22 {
  background-image: url(article22_main.jpg);
}
.wrapper.indexPage .hdArea .newContents a h3 {
  width: 57%;
  line-height: 1.5;
  font-feature-settings: "palt";
  font-size: 2.9vw;
}
.wrapper.indexPage .hdArea .newContents a h3 .tag {
  display: table;
  margin: 6px 4px 4px 0;
  padding: 4px 2px;
  box-sizing: border-box;
  font-size: 12px;
  color: #fff;
}
.wrapper.indexPage .hdArea .newContents a h3 .tag small {
  font-size: 80%;
  margin-right: 0.6em;
  color: #00b0f0;
}
.wrapper.indexPage .hdArea .newContents a h3 span:last-of-type {
  font-weight: 500;
}
.wrapper.indexPage .hdArea .newContents > div {
  position: relative;
}
.wrapper.indexPage .hdArea .newContents .bx-wrapper {
  margin-bottom: 0;
}
.wrapper.indexPage .hdArea .newContents .bx-wrapper .bx-viewport {
  left: 0;
  border: 0;
  box-shadow: none;
  background-color: #000;
}
.wrapper.indexPage .hdArea .newContents .bx-wrapper .bx-pager {
  bottom: -25px;
}
.wrapper.indexPage .hdArea .newContents .bx-wrapper .bx-pager.bx-default-pager a {
  background-color: #999999;
}
.wrapper.indexPage .hdArea .newContents .bx-wrapper .bx-pager.bx-default-pager a:hover {
  background-color: #ffffff;
}
.wrapper.indexPage .hdArea .newContents .bx-wrapper .bx-pager.bx-default-pager a.active {
  background-color: #ffffff;
}
.wrapper.indexPage .hdArea .newContents .bx-wrapper .bx-pager .bx-pager-item {
  padding-bottom: 3px;
}
.wrapper.indexPage .hdArea .newContents .bx-wrapper .bx-pager.bx-default-pager a {
  width: 5px;
  height: 5px;
}
.wrapper.indexPage .spissueArea {
  margin: 0 auto 70px;
  width: 90%;
}
.wrapper.indexPage .spissueArea > h2 {
  position: relative;
  margin: 0 0 20px 0;
  padding: 0 0 5px 0;
}
.wrapper.indexPage .spissueArea > h2 span {
  display: block;
}
.wrapper.indexPage .spissueArea > h2 span:first-of-type {
  width: 50%;
}
.wrapper.indexPage .spissueArea > h2 span:last-of-type {
  font-size: 16px;
  color: #fff;
}
.wrapper.indexPage .spissueArea .inner ul li {
  margin: 0 0 20px 0;
}
.wrapper.indexPage .spissueArea .inner ul li a {
  display: flex;
  justify-content: space-between;
  position: relative;
  text-decoration: none;
  color: #ffffff;
  border: 1px solid #fff;
}
.wrapper.indexPage .spissueArea .inner ul li a .photo {
  width: 45%;
  height: 27vw;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.wrapper.indexPage .spissueArea .inner ul li a .textBox {
  width: 52%;
  line-height: 1.5;
  font-feature-settings: "palt";
  font-size: 2.9vw;
}
.wrapper.indexPage .spissueArea .inner ul li a p {
  color: #00b0f0;
  margin-top: 1em;
}
.wrapper.indexPage .spissueArea .inner ul li a p.com_name {
  font-size: 2.7vw;
}
.wrapper.indexPage .spissueArea .inner ul li a p.title {
  color: #fff;
  margin-top: 0.5em;
}
.wrapper.indexPage .spissueArea .inner ul li a .btn {
  display: inline-block;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 1;
  padding: 4px 10px;
  background-color: #00b0f0;
}
.wrapper.indexPage .spissueArea .inner ul li a .btn img {
  display: block;
  width: auto;
  height: 18px;
}
.wrapper.indexPage .spissueArea .inner ul li a + a {
  margin-top: 20px;
}
.wrapper.indexPage .spissueArea .inner ul li.sp-1 a .photo {
  background-image: url(hdimg-1.jpg);
}
.wrapper.indexPage .spissueArea .inner ul li.sp-2 a .photo {
  background-image: url(hdimg-2.jpg);
}
.wrapper.indexPage .spissueArea .inner ul li.sp-3 a .photo {
  background-image: url(hdimg-3.jpg);
  background-position: top right;
}
.wrapper.indexPage .spissueArea .inner ul li.sp-3 a .textBox p.title {
  font-size: 2.6vw;
}
.wrapper.indexPage .spissueArea .inner ul li.sp-4 a .photo {
  background-image: url(hdimg-4.jpg);
}
.wrapper.indexPage .contentArea {
  margin: 0 0 100px 0;
  /* articleList */
}
.wrapper.indexPage .contentArea > h2 {
  position: relative;
  margin: 0 0 60px 0;
  padding: 0 0 5px 0;
  width: 70%;
}
.wrapper.indexPage .contentArea > h2:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: #002060;
  background: linear-gradient(to right, #002060 0%, #00b0f0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#002060", endColorstr="#00b0f0",GradientType=1 );
}
.wrapper.indexPage .contentArea > h2 span {
  display: block;
  padding: 0 0 0 15px;
}
.wrapper.indexPage .contentArea > h2 span img {
  width: auto;
  height: 27px;
}
.wrapper.indexPage .contentArea .themaArea {
  width: 90%;
  margin: -20px auto 30px;
}
.wrapper.indexPage .contentArea .themaArea a {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  display: inline-block;
  padding: 4px 8px;
  border: 0.5px solid #fff;
  margin: 0 5px 12px 0;
  transition: 0.3s;
}
.wrapper.indexPage .contentArea .themaArea a:first-child {
  background-color: #001848;
}
.wrapper.indexPage .contentArea .themaArea a:nth-child(2) {
  background-color: #005187;
}
.wrapper.indexPage .contentArea .themaArea a:nth-child(3) {
  background-color: #006ea7;
}
.wrapper.indexPage .contentArea .themaArea a:nth-child(4) {
  background-color: #00b0f0;
}
.wrapper.indexPage .contentArea .inner {
  margin: 0 auto;
  width: 95%;
}
.wrapper.indexPage .contentArea .articleList {
  /*li */
}
.wrapper.indexPage .contentArea .articleList li {
  margin: 0 0 20px 0;
  /* article-5 */
  /* article-4 */
  /* article-3 */
  /* article-1 */
  /* article-2 */
  /* article-6 */
  /* article-7 */
  /* article-8 */
  /* article-9 */
  /* article-10 */
  /* article-10 */
  /* article-12 */
  /* article-13 */
  /* article-14 */
  /* article-15 */
  /* article-16 */
  /* article-17 */
  /* article-18 */
  /* article-19 */
  /* article-20 */
  /* article-21 */
  /* article-22 */
  /* article-23 */
  /* article-24 */
  /* article-25 */
  /* article-26 */
  /* article-27 */
  /* article-28 */
  /* article-29 */
  /* article-30 */
  /* article-31 */
  /* sp-1 */
  /* sp-2 */
  /* sp-3 */
  /* sp-4 */
}
.wrapper.indexPage .contentArea .articleList li.article-5 a .photo {
  background-image: url(article5_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-4 a .photo {
  background-image: url(article4_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-3 a .photo {
  background-image: url(article3_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-1 a .photo {
  background-image: url(article1_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-2 a .photo {
  background-image: url(article2_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-6 a .photo {
  background-image: url(article6_main.jpg);
  background-size: 120%;
  background-position: top right;
}
.wrapper.indexPage .contentArea .articleList li.article-7 a .photo {
  background-image: url(article7_main.jpg?1208);
}
.wrapper.indexPage .contentArea .articleList li.article-8 a .photo {
  background-image: url(article8_main.jpg?1208);
}
.wrapper.indexPage .contentArea .articleList li.article-9 a .photo {
  background-image: url(article9_main.jpg?1208);
}
.wrapper.indexPage .contentArea .articleList li.article-10 a .photo {
  background-image: url(article10_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-11 a .photo {
  background-image: url(article11_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-12 a .photo {
  background-image: url(article12_main.jpg?0309);
}
.wrapper.indexPage .contentArea .articleList li.article-13 a .photo {
  background-image: url(article13_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-14 a .photo {
  background-image: url(article14_main.jpg?060701);
}
.wrapper.indexPage .contentArea .articleList li.article-15 a .photo {
  background-image: url(article15_main.jpg?060701);
}
.wrapper.indexPage .contentArea .articleList li.article-16 a .photo {
  background-image: url(article16_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-17 a .photo {
  background-image: url(article17_main.jpg?0810);
}
.wrapper.indexPage .contentArea .articleList li.article-18 a .photo {
  background-image: url(article18_main.jpg?0922);
}
.wrapper.indexPage .contentArea .articleList li.article-19 a .photo {
  background-image: url(article19_main.jpg?0922);
}
.wrapper.indexPage .contentArea .articleList li.article-20 a .photo {
  background-image: url(article20_main.jpg?1205_2);
}
.wrapper.indexPage .contentArea .articleList li.article-21 a .photo {
  background-image: url(article21_main.jpg?1222);
}
.wrapper.indexPage .contentArea .articleList li.article-22 a .photo {
  background-image: url(article22_main.jpg?0116);
}
.wrapper.indexPage .contentArea .articleList li.article-23 a .photo {
  background-image: url(article23_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-24 a .photo {
  background-image: url(article24_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-25 a .photo {
  background-image: url(article25_main.jpg);
}
.wrapper.indexPage .contentArea .articleList li.article-26 a .photo {
  background-image: url(article26_main.jpg?0706);
}
.wrapper.indexPage .contentArea .articleList li.article-27 a .photo {
  background-image: url(article27_main.jpg?0809);
}
.wrapper.indexPage .contentArea .articleList li.article-28 a .photo {
  background-image: url(article28_main.jpg?0607);
}
.wrapper.indexPage .contentArea .articleList li.article-29 a .photo {
  background-image: url(article29_main.jpg?0731);
}
.wrapper.indexPage .contentArea .articleList li.article-30 a .photo {
  background-image: url(article30_main.jpg?1219);
}
.wrapper.indexPage .contentArea .articleList li.article-31 a .photo {
  background-image: url(article31_main.jpg?1217);
}
.wrapper.indexPage .contentArea .articleList li.sp-1 a .photo {
  background-image: url(hdimg-1.jpg);
}
.wrapper.indexPage .contentArea .articleList li.sp-2 a .photo {
  background-image: url(hdimg-2.jpg);
}
.wrapper.indexPage .contentArea .articleList li.sp-3 a .photo {
  background-image: url(hdimg-3.jpg);
}
.wrapper.indexPage .contentArea .articleList li.sp-4 a .photo {
  background-image: url(hdimg-4.jpg);
}
.wrapper.indexPage .contentArea .articleList a {
  display: flex;
  justify-content: space-between;
  position: relative;
  text-decoration: none;
  color: #ffffff;
}
.wrapper.indexPage .contentArea .articleList a:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 2px;
  height: 100%;
  background: #00b0f0;
  background: linear-gradient(to bottom, #00b0f0 0%, #002060 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#00b0f0", endColorstr="#002060",GradientType=0 );
}
.wrapper.indexPage .contentArea .articleList a:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: rgb(0, 32, 96);
  background: linear-gradient(to right, rgb(0, 32, 96) 0%, rgb(0, 176, 240) 45%, rgb(0, 176, 240) 60%, rgb(0, 176, 240) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#002060", endColorstr="#00b0f0",GradientType=1 );
}
.wrapper.indexPage .contentArea .articleList a .newIco {
  position: absolute;
  width: 50px;
}
.wrapper.indexPage .contentArea .articleList a .photo {
  width: 43%;
  height: 28.5vw;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.wrapper.indexPage .contentArea .articleList a .new {
  font-size: min(3vw, 13px);
  font-weight: 900;
  background-color: #00b0f0;
  width: min(10vw, 50px);
  height: min(6vw, 36px);
  position: absolute;
  display: block;
  color: #fff;
  bottom: 0;
  left: 0;
  text-align: center;
  line-height: min(6vw, 36px);
}
.wrapper.indexPage .contentArea .articleList a h2 {
  width: 54%;
  line-height: 1.5;
  font-feature-settings: "palt";
  font-size: 2.9vw;
}
.wrapper.indexPage .contentArea .articleList a h2 .tag {
  display: table;
  margin: 5px 0 8px 0;
  box-sizing: border-box;
  font-size: 10px;
  color: #fff;
}
.wrapper.indexPage .contentArea .articleList a h2 .tag.tag2 {
  font-size: 3.5vw;
}
.wrapper.indexPage .contentArea .articleList a h2 .tag small {
  font-size: 80%;
  margin-right: 0.6em;
  color: #00b0f0;
}
.wrapper.indexPage .contentArea .articleList a h2 span:nth-of-type(2) {
  font-weight: 500;
}
.wrapper.indexPage .contentArea .articleList a .btn {
  display: inline-block;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 1;
  margin-bottom: 10px;
}
.wrapper.indexPage .contentArea .articleList a .btn img {
  display: block;
  width: auto;
  height: 15px;
}
.wrapper.indexPage .contentArea.spissue {
  margin-bottom: 70px;
}
.wrapper.indexPage .contentArea.spissue h2 {
  width: 75%;
  margin-bottom: 10px;
}
.wrapper.indexPage .contentArea.spissue > p {
  color: #fff;
  font-size: 14px;
  width: 95%;
  margin: 0 auto 20px;
}
.wrapper.indexPage.thema {
  /* pagenationList */
}
.wrapper.indexPage.thema .hdArea .newContents:before {
  background: #333;
  background: linear-gradient(to right, #333 0%, #fff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#333", endColorstr="#fff",GradientType=1 );
}
.wrapper.indexPage.thema .hdArea .newContents h2 {
  background-color: #333;
}
.wrapper.indexPage.thema .hdArea .newContents h2:after {
  border-color: #333 transparent transparent transparent;
}
.wrapper.indexPage.thema .hdArea .newContents > div:after {
  background-image: url(arrow_w-bold.svg);
}
.wrapper.indexPage.thema .hdArea .textArea .lead {
  font-size: 15px;
  line-height: 1.4;
  font-weight: 600;
}
.wrapper.indexPage.thema .hdArea .textArea .lead span {
  font-size: 26px;
  letter-spacing: 1px;
  font-weight: 300;
}
.wrapper.indexPage.thema .contentArea > h2 span:after {
  background-image: url(arrow_w-bold.svg);
}
.wrapper.indexPage.thema .contentArea > h2:after {
  background: #333;
  background: linear-gradient(to right, #333 0%, #fff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#333", endColorstr="#fff",GradientType=1 );
}
.wrapper.indexPage.thema .contentArea .articleList a h2 .tag {
  color: #333;
}
.wrapper.indexPage.thema .contentArea .articleList a:before {
  background: #333;
  background: linear-gradient(to bottom, #333 0%, #a6a6a6 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#333", endColorstr="#a6a6a6",GradientType=0 );
}
.wrapper.indexPage.thema .contentArea .articleList a:after {
  background: rgb(166, 166, 166);
  background: linear-gradient(to right, rgb(166, 166, 166) 0%, rgb(51, 51, 51) 45%, rgb(51, 51, 51) 60%, rgb(51, 51, 51) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#333", endColorstr="#a6a6a6",GradientType=1 );
}
.wrapper.indexPage.thema .contentArea .articleList a .btn {
  background-color: #333;
}
.wrapper.indexPage.thema .contentArea .articleList a:hover .btn {
  background-color: #a6a6a6;
}
.wrapper.indexPage.thema .pagenationList {
  margin: 0 auto 50px;
  width: 134px;
}
.wrapper.indexPage.thema .pagenationList li {
  width: auto;
  text-align: center;
}
.wrapper.indexPage.thema .pagenationList li.indexLink {
  margin: 20px auto 0 auto;
  width: 90%;
}
.wrapper.indexPage.thema .pagenationList li.indexLink a {
  display: block;
  border: 0;
  width: 100%;
  height: auto;
  text-decoration: underline;
  font-weight: bold;
  font-size: 18px;
  color: #ffffff;
}
.wrapper.indexPage.thema .pagenationList li.indexLink a.active a {
  background-color: #00b0f0;
}
.wrapper.indexPage.thema .pagenationList li.indexLink a:hover a {
  background-color: #00b0f0;
}
.wrapper.article {
  /* hdArea */
  /* figAreaLead */
  /* secBox */
  /* linkNext */
  /* pagenationList */
  /* bannerArea */
  /* linkOther */
}
.wrapper.article .hdArea {
  margin: 0 0 25px 0;
  /* titleArea */
}
.wrapper.article .hdArea h1 {
  padding: 0 0 0 10px;
}
.wrapper.article .hdArea h1 img {
  width: auto;
  height: 40px;
}
.wrapper.article .hdArea .photo {
  margin: 0 0 10px 0;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
}
.wrapper.article .hdArea .titleArea {
  /* h2 */
}
.wrapper.article .hdArea .titleArea h2 {
  position: relative;
  padding: 20px 0px;
}
.wrapper.article .hdArea .titleArea h2:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #00b0f0;
  background: linear-gradient(to right, #00b0f0 0%, #002060 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#00b0f0", endColorstr="#002060",GradientType=1 );
}
.wrapper.article .hdArea .titleArea h2 span {
  display: block;
  position: relative;
  z-index: 1;
  /* ttl */
}
.wrapper.article .hdArea .titleArea h2 span.tag {
  display: inline-block;
  position: absolute;
  top: 0px;
  left: 2%;
  z-index: 9;
  padding: 10px 15px;
  background-color: #000;
  font-size: 12px;
  color: #00b0f0;
}
.wrapper.article .hdArea .titleArea h2 span.ttl {
  padding: 30px 5px 20px 10px;
  background-color: #fff;
}
.wrapper.article .hdArea .titleArea h2 span.ttl > span {
  line-height: 1.4;
  font-feature-settings: "palt";
  font-size: 23px;
}
.wrapper.article .hdArea .titleArea h2 span.ttl .small {
  margin-bottom: 0.5em;
  font-size: 16px;
}
.wrapper.article .hdArea.sample {
  margin: 0;
}
.wrapper.article .hdArea.sample h1 {
  padding: 5px 0 0 10px;
  height: 45px;
}
.wrapper.article .hdArea.sample h1 a {
  display: block;
  width: 84px;
}
.wrapper.article .hdArea.sample h1 a img {
  width: 100%;
}
.wrapper.article .hdArea.sample .titleArea.l-3 {
  bottom: 30px;
}
.wrapper.article .hdArea.sample .titleArea h2 {
  padding-top: 10px;
}
.wrapper.article .hdArea.sample .titleArea h2:before {
  content: none;
}
.wrapper.article .hdArea.sample .titleArea h2 span.ttl {
  background-color: #fff;
  color: #000;
  padding-top: 18px;
  padding-right: 0;
  margin-top: 30px;
}
.wrapper.article .hdArea.sample .titleArea h2 span.ttl .tag {
  left: 0;
  font-size: 15px;
  font-weight: 800;
  background-color: #006ea7;
  color: #fff;
  position: absolute;
  top: -33px;
  margin-bottom: 15px;
  padding: 6px 7px;
  display: block;
}
.wrapper.article .hdArea.sample .titleArea h2 span.ttl .tag small {
  font-size: 13px;
  margin-right: 0.7em;
  margin-left: 2px;
}
.wrapper.article .hdArea.sample .titleArea h2 span.ttl .sub {
  font-weight: 500;
}
.wrapper.article .hdArea.sample.sample_p2 .titleArea {
  bottom: 0;
}
.wrapper.article .hdArea.sample.sample_p2 .titleArea.l-1 {
  bottom: 30px;
}
.wrapper.article .hdArea.sample.sample_p2 .titleArea h2 span.ttl {
  padding-bottom: 15px;
  padding-top: 25px;
}
.wrapper.article .hdArea.sample.sample_p2 .titleArea h2 span.ttl .tag {
  font-size: 15px;
  margin-bottom: 10px;
}
.wrapper.article .hdArea.sample.sample_p2 .titleArea h2 span.ttl > span {
  font-size: 22px;
  line-height: 1.4;
}
.wrapper.article .hdArea.sample.sample_p2 .titleArea h2 span.ttl > span.s26 {
  font-size: 26px;
}
.wrapper.article .figAreaLead {
  margin: 0 0 30px 0;
  padding: 10px 5px;
  background-color: #ffffff;
}
.wrapper.article .lead {
  margin: 0 auto 25px auto;
  width: 90%;
}
.wrapper.article .lead p {
  line-height: 1.5;
  font-size: 16px;
  color: #ffffff;
}
.wrapper.article .lead a {
  color: #00b0f0;
}
.wrapper.article .secBox {
  margin: 0 auto;
  padding: 40px 0px;
  box-sizing: border-box;
  width: 90%;
  background-color: #ffffff;
  /* p */
  /* photoArea */
  /* figArea */
  /* infoBox */
}
.wrapper.article .secBox h2 {
  position: relative;
  margin: 0 0 40px 0;
  padding: 0 0 0 6%;
  font-feature-settings: "palt";
  font-size: 19px;
}
.wrapper.article .secBox h2:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 5%;
  height: 5px;
  background: #002060;
  background: linear-gradient(to right, #002060 0%, #00b0f0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#002060", endColorstr="#00b0f0",GradientType=1 );
}
.wrapper.article .secBox .innerArea {
  margin: 0 auto;
  width: 90%;
}
.wrapper.article .secBox p {
  position: relative;
  margin-bottom: 1.5em;
  line-height: 1.75;
  font-size: 16px;
  /* interviewee */
}
.wrapper.article .secBox p.interviewer {
  padding: 0 0 0 2.5em;
  font-weight: bold;
}
.wrapper.article .secBox p.interviewer span {
  position: absolute;
  top: 0px;
  left: 0;
}
.wrapper.article .secBox p.interviewee {
  padding: 0 0 0 2.5em;
}
.wrapper.article .secBox p.interviewee span {
  position: absolute;
  top: 0px;
  left: 0;
  font-weight: bold;
}
.wrapper.article .secBox p.interviewee .no-wrap {
  position: relative;
  white-space: nowrap;
  font-weight: normal;
}
.wrapper.article .secBox p.interviewee.person1 span {
  color: #002060;
}
.wrapper.article .secBox p.interviewee.person1 .no-wrap {
  color: #333;
}
.wrapper.article .secBox p.interviewee.person2 span {
  color: #00b0f0;
}
.wrapper.article .secBox p a {
  color: #0066a5;
}
.wrapper.article .secBox p a:hover {
  text-decoration: none;
}
.wrapper.article .secBox .photoArea {
  margin: 40px 0;
}
.wrapper.article .secBox .photoArea img {
  display: block;
}
.wrapper.article .secBox .photoArea .profileText {
  padding: 10px 15px;
  box-sizing: border-box;
  background-color: #002060;
}
.wrapper.article .secBox .photoArea p {
  color: #ffffff;
}
.wrapper.article .secBox .photoArea p.name {
  font-weight: bold;
}
.wrapper.article .secBox .photoArea p.name strong {
  margin-right: 0.5em;
  font-weight: bold;
  font-size: 20px;
}
.wrapper.article .secBox .photoArea p.profile {
  line-height: 1.3;
  font-size: 14px;
}
.wrapper.article .secBox .photoArea p.text {
  line-height: 1.5;
  font-size: 13px;
}
.wrapper.article .secBox .photoArea p.text .small {
  display: block;
  margin-top: 1em;
  font-size: 11px;
}
.wrapper.article .secBox .figArea {
  margin: 40px auto;
  width: 90%;
}
.wrapper.article .secBox .figArea img {
  display: block;
}
.wrapper.article .secBox .figArea .figCaption {
  padding: 10px 10px;
  box-sizing: border-box;
  background-color: #002060;
}
.wrapper.article .secBox .figArea .figCaption p {
  margin-bottom: 0;
  font-weight: bold;
  font-size: 13px;
  color: #ffffff;
}
.wrapper.article .secBox .infoBox {
  margin: 0 0 30px 0;
  padding: 20px 10px;
  border: 1px solid #000000;
  box-sizing: border-box;
}
.wrapper.article .secBox .infoBox h3 {
  margin: 0 0 1.5em 0;
  line-height: 1.5;
  font-size: 16px;
}
.wrapper.article .secBox .infoBox p {
  line-height: 1.75;
  font-size: 14px;
}
.wrapper.article .secBox .infoBox a {
  display: block;
  margin: 0 auto;
  padding: 10px 20px;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  background-color: #002060;
  color: #ffffff;
}
.wrapper.article .secBox .bgnOut {
  display: block;
  position: relative;
  margin: 0 auto;
  padding: 10px 20px;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  background-color: #002060;
  line-height: 1.5;
  font-weight: bold;
  font-size: 14px;
  color: #ffffff;
}
.wrapper.article .secBox .bgnOut:after {
  content: "▲";
  display: block;
  position: absolute;
  top: 35%;
  right: 10px;
  transform: rotate(90deg);
}
.wrapper.article .linkNext {
  margin: 40px 0 0 0;
}
.wrapper.article .linkNext a {
  display: block;
  position: relative;
  margin: 0 auto;
  padding: 10px 0 10px 55px;
  border: 2px solid #00b0f0;
  box-sizing: border-box;
  width: 90%;
  text-decoration: none;
  line-height: 1.3;
  font-feature-settings: "palt";
  font-weight: bold;
  color: #000000;
}
.wrapper.article .linkNext a:after {
  content: "";
  display: block;
  position: absolute;
  top: 5px;
  right: 5px;
  width: 15px;
  height: 15px;
  background-image: url(arrow_b.svg);
  background-repeat: no-repeat;
  background-size: cover;
}
.wrapper.article .linkNext a span {
  display: inline-block;
  position: absolute;
  top: 18px;
  left: -10px;
  padding: 2px 5px;
  background: #002060;
  background: linear-gradient(to right, #002060 0%, #00b0f0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#002060", endColorstr="#00b0f0",GradientType=1 );
  color: #ffffff;
}
.wrapper.article .linkOut {
  display: block;
  position: relative;
  margin: 0 auto;
  padding: 10px 30px 10px 10px;
  box-sizing: border-box;
  width: 90%;
  text-decoration: none;
  background-color: #0066a5;
  font-weight: bold;
  font-feature-settings: "palt";
  font-size: 18px;
  color: #ffffff;
}
.wrapper.article .linkOut:before {
  content: "";
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 9;
  width: 62px;
  height: 100%;
  background-color: #00b0f0;
  background-image: url(arrow_w.svg);
  background-repeat: no-repeat;
  background-size: 60px 60px;
  background-position: top 8px center;
}
.wrapper.article .textlink {
  font-size: 15px;
  font-weight: bold;
  color: #002060;
  text-decoration: underline;
  text-align: center;
  display: block;
}
.wrapper.article .pagenationList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 50px auto;
  width: 134px;
}
.wrapper.article .pagenationList li {
  width: 30%;
}
.wrapper.article .pagenationList li.active a {
  background-color: #00b0f0;
}
.wrapper.article .pagenationList li a {
  display: block;
  text-decoration: none;
  padding: 8px 0;
  border: 1px solid #00b0f0;
  box-sizing: border-box;
  width: 40px;
  height: 40px;
  text-align: center;
  color: #ffffff;
}
.wrapper.article .pagenationList li.indexLink {
  margin: 20px auto 0 auto;
  width: 90%;
}
.wrapper.article .pagenationList li.indexLink a {
  display: block;
  border: 0;
  width: 100%;
  height: auto;
  text-decoration: underline;
  font-weight: bold;
  font-size: 18px;
  color: #ffffff;
}
.wrapper.article .link_top {
  border: 1px solid #fff;
  display: block;
  margin: 0 auto 80px;
  padding: 20px 0;
  width: min(70%, 300px);
  text-decoration: none;
}
.wrapper.article .link_top span {
  text-align: center;
  color: #fff;
  display: block;
  font-size: 18px;
  font-weight: 700;
  display: block;
  margin-top: 0.5em;
}
.wrapper.article .link_top > img {
  width: min(50%, 120px);
  margin: auto;
  display: block;
}
.wrapper.article .bannerArea {
  margin: 0 0 80px 0;
}
.wrapper.article .bannerArea li {
  margin: 0 auto 20px auto;
  width: 80%;
  min-height: 74px;
}
.wrapper.article .bannerArea a {
  display: block;
  position: relative;
  padding: 10px 20px 10px 10px;
  box-sizing: border-box;
  border: 1px solid #ffffff;
  width: 100%;
  background: #002060;
  background: linear-gradient(to right, #002060 0%, #00b0f0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#002060", endColorstr="#00b0f0",GradientType=1 );
  text-decoration: none;
  line-height: 1.4;
  font-size: 18px;
  color: #ffffff;
}
.wrapper.article .bannerArea a:after {
  content: "";
  display: block;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-image: url(arrow_w.svg);
  background-size: cover;
}
.wrapper.article .bannerArea .logo a {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}
.wrapper.article .bannerArea .logo img {
  display: block;
  width: 150px;
}
.wrapper.article .bannerArea .logo span {
  display: block;
  margin-left: 5px;
  padding-bottom: 8px;
}
.wrapper.article .bannerArea.bannerArea2 {
  display: flex;
  margin-bottom: 0;
  width: 100%;
  position: fixed;
  z-index: 9998;
  bottom: 60px;
  transition: 0.2s;
}
.wrapper.article .bannerArea.bannerArea2 li {
  min-height: 36px;
  margin-bottom: 0;
}
.wrapper.article .bannerArea.bannerArea2 a {
  font-size: 10px;
  padding: 7px 5px 5px 5px;
  text-align: center;
  line-height: 1.3;
}
.wrapper.article .bannerArea.bannerArea2 a:after {
  content: none;
}
.wrapper.article .bannerArea.bannerArea2.dn {
  opacity: 0;
  pointer-events: none;
}
.wrapper.article .bannerArea.p2 {
  margin: 50px auto 0;
}
.wrapper.article .bannerArea.bannerArea_re {
  text-align: center;
  font-weight: 700;
}
.wrapper.article .bannerArea.bannerArea_re a::after {
  content: none;
}
.wrapper.article .bannerArea.bannerArea_re small {
  font-size: 52%;
  text-align: center;
  display: block;
}
.wrapper.article .bannerArea.mag {
  border: none;
  margin: 0 auto 60px;
}
.wrapper.article .bannerArea.mag a {
  border: none;
}
.wrapper.article .link_article {
  width: 90%;
  margin: 50px auto 30px;
}
.wrapper.article .link_article > p {
  font-size: 16px;
  text-align: center;
  font-weight: bold;
}
.wrapper.article .link_article a {
  display: block;
  text-decoration: none;
  line-height: 1.72;
  font-size: 11px;
  color: #ffffff;
  display: flex;
  justify-content: space-between;
  position: relative;
  background-color: #000;
}
.wrapper.article .link_article a .photo {
  width: 40%;
  height: min(25.9vw, 120px);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}
.wrapper.article .link_article a .photo.p23 {
  background-image: url(article23_main.jpg);
}
.wrapper.article .link_article a h3 {
  width: 57%;
  line-height: 1.5;
  font-feature-settings: "palt";
  font-size: min(2.9vw, 14px);
}
.wrapper.article .link_article a h3 .tag {
  display: table;
  margin: 8px 0;
  padding: 4px 8px;
  box-sizing: border-box;
  background-color: #002060;
  font-size: 12px;
  color: #fff;
}
.wrapper.article .link_article li + li {
  margin-top: 10px;
}
.wrapper.article .linkOther {
  display: block;
  margin: 0 auto 30px auto;
  box-sizing: border-box;
  width: 90%;
  background-color: #00b0f0;
  text-decoration: none;
  line-height: 1.4;
  font-weight: bold;
  font-size: 18px;
  color: #ffffff;
}
.wrapper.article .linkOther span {
  display: block;
  position: relative;
  padding: 5px 10px 5px 10px;
  box-sizing: border-box;
}
.wrapper.article .linkOther span.title {
  padding: 5px 10px 5px 10px;
  background-color: #002060;
  font-weight: bold;
  font-size: 15px;
}
.wrapper.article .linkOther span.title:after {
  content: "＞";
  display: block;
  position: absolute;
  top: 5px;
  right: 10px;
  font-weight: bold;
}
.wrapper .logo {
  display: block;
  margin: 0 auto;
  width: 200px;
}
.wrapper.p1 {
  /* hdArea */
  /* secBox */
}
.wrapper.p1 .hdArea .photo {
  height: 64.8vw;
}
.wrapper.p1 .secBox p {
  /* personSP */
}
.wrapper.p1 .secBox p.personSP span {
  display: inline;
  position: static;
}
.wrapper.p1 .secBox p.personSP.person1 span {
  margin-left: -2.5em;
  margin-right: 0.5em;
}
.wrapper.p1 .secBox p.personSP.person2 span {
  margin-left: -2.5em;
  margin-right: 0.5em;
}
.wrapper.p2 {
  /* hdArea */
}
.wrapper.p2 .hdArea .photo {
  height: 48vw;
}
.wrapper.p2 .sec1 {
  margin-bottom: 60px;
}
.wrapper.p2 .sec2 {
  margin-bottom: 30px;
}
.wrapper.article-5 {
  /* hdArea */
}
.wrapper.article-5 .hdArea .photo {
  background-image: url(article5_main.jpg);
}
.wrapper.article-4 {
  /* hdArea */
  /* p1 */
}
.wrapper.article-4 .hdArea .photo {
  background-image: url(article4_main.jpg);
  background-position: top 30% center;
}
.wrapper.article-4 .secBox p {
  /* personSP */
}
.wrapper.article-4 .secBox p.personSP.person1 span {
  margin-right: 0em;
}
.wrapper.article-4 .linkNext a {
  font-size: 14px;
}
.wrapper.article-4.p1 .figArea {
  margin-top: 0;
}
.wrapper.article-3 {
  /* hdArea */
}
.wrapper.article-3 .hdArea .photo {
  background-image: url(article3_main.jpg);
  background-position: center;
}
.wrapper.article-3 .introImg {
  margin: 0 auto 20px auto;
  max-width: 700px;
  width: 100%;
}
.wrapper.article-3 .introImg img {
  display: block;
}
.wrapper.article-3 .secBox .figArea a {
  text-decoration: none;
}
.wrapper.article-3 .linkNext a {
  font-size: 14px;
}
.wrapper.article-1 {
  /* hdArea */
}
.wrapper.article-1 .hdArea .photo {
  background-image: url(article1_main.jpg);
}
.wrapper.article-1 .sec1 {
  margin-bottom: 60px;
}
.wrapper.article-2 {
  /* hdArea */
}
.wrapper.article-2 .hdArea .photo {
  background-image: url(article2_main.jpg);
  background-position: center;
}
.wrapper.article-6 {
  /* hdArea */
  /* p2 */
}
.wrapper.article-6 .hdArea .photo {
  background-image: url(article6_main.jpg);
  background-position: center;
}
.wrapper.article-6 .linkNext a {
  padding: 10px 20px 10px 55px;
  font-size: 14px;
}
.wrapper.article-6.p2 {
  /* hdArea */
}
.wrapper.article-6.p2 .hdArea .titleArea {
  /* h2 */
}
.wrapper.article-6.p2 .hdArea .titleArea h2 span.ttl > span {
  font-size: 22px;
}
.wrapper.article-6.p2 .linkOut {
  width: 100%;
  font-size: 15px;
}
.wrapper.article-6.p2 .linkOut:before {
  background-position: top 5px center;
}
.wrapper.article-7 {
  /* hdArea */
  /* linkOhterFlex */
}
.wrapper.article-7 .hdArea .photo {
  background-image: url(article7_main.jpg?1208);
  background-position: top 15% center;
}
.wrapper.article-7 .secBox.sec1 {
  margin-bottom: 60px;
}
.wrapper.article-7 .linkOhterFlex .linkOther span {
  font-size: 15px;
}
.wrapper.article-8 {
  /* hdArea */
  /* linkOhterFlex */
}
.wrapper.article-8 .hdArea .photo {
  background-image: url(article8_main.jpg?1208);
}
.wrapper.article-8 .secBox.sec1 {
  margin-bottom: 60px;
}
.wrapper.article-8 .secBox.sec1 .linkNext a {
  padding: 10px 20px 10px 55px;
}
.wrapper.article-8 .linkOut {
  padding-right: 62px;
  margin-bottom: 20px;
  width: 100%;
  font-size: 15px;
}
.wrapper.article-8 .linkOut:before {
  background-position: top 50% center;
}
.wrapper.article-8 .linkOhterFlex .linkOther span {
  font-size: 15px;
}
.wrapper.article-8 .contentLinkArea {
  margin: 0 0 40px 0;
  padding: 20px 10px;
  box-sizing: border-box;
  margin-top: 60px;
  background-color: #dff2f7;
}
.wrapper.article-8 .contentLinkArea h3 {
  margin-bottom: 15px;
  text-align: center;
  font-size: 16px;
  color: #002060;
}
.wrapper.article-9 {
  /* hdArea */
}
.wrapper.article-9.p2 {
  /* hdArea */
}
.wrapper.article-9.p2 .hdArea .photo {
  background-position: top 20% right;
  background-size: 120%;
}
.wrapper.article-9 .hdArea .photo {
  background-image: url(article9_main.jpg?1208);
  background-position: top right;
  background-size: 120%;
}
.wrapper.article-9 .secBox.sec1 {
  margin-bottom: 60px;
}
.wrapper.article-10 {
  /* hdArea */
  /* p2 */
}
.wrapper.article-10 .hdArea .photo {
  background-image: url(article10_main.jpg?1215);
  background-position: center;
}
.wrapper.article-10 .linkNext a span {
  top: 30%;
}
.wrapper.article-10.p2 .secBox p {
  /* interviewee */
}
.wrapper.article-10.p2 .secBox p.interviewee.personSP span {
  display: inline;
  position: static;
  margin-left: -2.5em;
  margin-right: 1.5em;
  font-feature-settings: "palt";
}
.wrapper.article-11 {
  /* hdArea */
  /* p2 */
}
.wrapper.article-11 .hdArea .photo {
  background-image: url(article11_main.jpg);
  background-position: top 80% center;
}
.wrapper.article-11 .linkNext a {
  padding: 10px 30px 10px 55px;
}
.wrapper.article-11.p2 {
  /* linkOut */
}
.wrapper.article-11.p2 .linkOut {
  min-height: 40px;
  margin-top: 20px;
}
.wrapper.article-11.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-11.p2 .linkOut:first-of-type {
  margin-top: 80px;
}
.wrapper.article-12 {
  /* hdArea */
  /* p2 */
}
.wrapper.article-12 .hdArea .photo {
  background-image: url(article12_main.jpg?0309);
  background-size: 118% auto;
  background-position: top right;
}
.wrapper.article-12 .linkNext a {
  padding: 10px 30px 10px 55px;
}
.wrapper.article-12.p2 .linkOut {
  min-height: 40px;
  margin-top: 20px;
}
.wrapper.article-12.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-12.p2 .linkOut:first-of-type {
  font-size: 4vw;
  margin-top: 80px;
}
.wrapper.article-13 {
  /* hdArea */
  /* p2 */
}
.wrapper.article-13 .hdArea .photo {
  background-image: url(article13_main.jpg);
  background-size: 115% auto;
  background-position: 50% 35%;
}
.wrapper.article-13 .linkNext a {
  padding: 10px 30px 10px 55px;
}
.wrapper.article-13.p2 .photo {
  background-size: 90% auto;
  background-position: 50% 25%;
}
.wrapper.article-13.p2 .linkOut {
  min-height: 40px;
  margin-top: 20px;
  font-size: 3.5vw;
}
.wrapper.article-13.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-13.p2 .linkOut:first-of-type {
  margin-top: 80px;
}
.wrapper.article-14 {
  /* hdArea */
  /* p2 */
}
.wrapper.article-14 .hdArea .photo {
  background-image: url(article14_main.jpg?060701);
  background-position: 30% 15%;
}
.wrapper.article-14 .linkNext a {
  padding: 10px 30px 10px 55px;
}
.wrapper.article-14.p2 .photo {
  background-position: 50% 10%;
}
.wrapper.article-14.p2 .linkOut {
  min-height: 40px;
  margin-top: 20px;
  font-size: 3.5vw;
  padding-right: 15%;
}
.wrapper.article-14.p2 .linkOut br.pc {
  display: none;
}
.wrapper.article-14.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-14.p2 .linkOut:first-of-type {
  margin-top: 80px;
}
.wrapper.article-14.p2 .secBox p {
  /* interviewee */
}
.wrapper.article-14.p2 .secBox p.interviewee.personSP span {
  display: inline;
  position: static;
  margin-left: -2.5em;
  margin-right: 0.5em;
}
.wrapper.article-15 {
  /* hdArea */
  /* p2 */
}
.wrapper.article-15 .hdArea .photo {
  background-image: url(article15_main.jpg);
  background-size: 120% auto;
  background-position: 100% 15%;
}
.wrapper.article-15 .linkNext a {
  padding: 10px 30px 10px 55px;
}
.wrapper.article-15.p2 .hdArea .titleArea {
  bottom: -40px;
}
.wrapper.article-15.p2 .photo {
  background-size: 120% auto;
  background-position: 100% 20%;
}
.wrapper.article-15.p2 .linkOut {
  min-height: 40px;
  margin-top: 20px;
  font-size: 3.5vw;
}
.wrapper.article-15.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-15.p2 .linkOut:first-of-type {
  margin-top: 80px;
}
.wrapper.article-16 {
  /* hdArea */
  /* p2 */
}
.wrapper.article-16 .hdArea .photo {
  background-image: url(article16_main.jpg);
  background-position: 100% 20%;
}
.wrapper.article-16 .linkNext a {
  padding: 10px 30px 10px 55px;
}
.wrapper.article-16.p2 .hdArea .titleArea {
  bottom: -40px;
}
.wrapper.article-16.p2 .photo {
  background-size: 100%;
  background-position: 100% 10%;
}
.wrapper.article-16.p2 .linkOut {
  min-height: 40px;
  margin-top: 20px;
  font-size: 3.5vw;
}
.wrapper.article-16.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-16.p2 .linkOut:first-of-type {
  margin-top: 80px;
}
.wrapper.article-16.p2 .secBox p {
  /* interviewee */
}
.wrapper.article-16.p2 .secBox p.interviewee.personSP span {
  display: inline;
  position: static;
  margin-left: -2.5em;
  margin-right: 0.5em;
}
.wrapper.article-17 {
  /* hdArea */
}
.wrapper.article-17 .hdArea .photo {
  background-image: url(article17_main.jpg?0810);
  background-position: 100% 20%;
}
.wrapper.article-17.p2 .linkOut {
  font-size: 3.5vw;
  margin-top: 70px;
}
.wrapper.article-17.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-17.p2 .linkOut.linkOut2 {
  padding-right: 50px;
  margin-top: 40px;
  line-height: 1.6;
}
.wrapper.article-17.p2 .linkOut.linkOut2 small {
  font-size: 3vw;
  padding-bottom: 1em;
  font-weight: 500;
}
.wrapper.article-17.p2 .secBox p {
  /* interviewee */
}
.wrapper.article-17.p2 .secBox p.interviewee.personSP span {
  display: inline;
  position: static;
  margin-left: -2.5em;
  margin-right: 0.5em;
}
.wrapper.article-18 {
  /* hdArea */
}
.wrapper.article-18 .hdArea .photo {
  background-image: url(article18_main.jpg?0922);
  background-position: 100% 20%;
}
.wrapper.article-18.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
  font-size: 3.5vw;
}
.wrapper.article-18.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-19 {
  /* hdArea */
}
.wrapper.article-19 .hdArea .photo {
  background-image: url(article19_main.jpg?0922);
  background-position: 100% 20%;
}
.wrapper.article-19.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
}
.wrapper.article-19.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-20 {
  /* hdArea */
}
.wrapper.article-20 .hdArea .photo {
  background-image: url(article20_main.jpg?1205_2);
  background-position: 60%;
}
.wrapper.article-20.p2 .photo {
  background-position: 100% 60%;
}
.wrapper.article-20.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
  font-size: 3.5vw;
}
.wrapper.article-20.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-20.p2 .secBox p {
  /* interviewee */
}
.wrapper.article-20.p2 .secBox p.interviewee.personSP span {
  display: inline;
  position: static;
  margin-left: -2.5em;
  margin-right: 0.5em;
}
.wrapper.article-21 {
  /* hdArea */
}
.wrapper.article-21 .hdArea .photo {
  background-image: url(article21_main.jpg?1222);
  background-position: 60%;
}
.wrapper.article-21.p1 .sec1 {
  margin-bottom: 60px;
}
.wrapper.article-21.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
  font-size: 3.3vw;
}
.wrapper.article-21.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-22 {
  /* hdArea */
}
.wrapper.article-22 .hdArea .photo {
  background-image: url(article22_main.jpg?0116);
  background-position-y: 20%;
  background-position-x: 50%;
}
.wrapper.article-22.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
  font-size: 3.5vw;
}
.wrapper.article-22.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-23 {
  /* hdArea */
}
.wrapper.article-23 .hdArea .photo {
  background-image: url(article23_main.jpg);
  background-position-y: 27%;
  background-position-x: 40%;
}
.wrapper.article-23.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
  font-size: 3.5vw;
}
.wrapper.article-23.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-24 {
  /* hdArea */
}
.wrapper.article-24 .hdArea .photo {
  background-image: url(article24_main.jpg);
  background-position-y: 22%;
  background-position-x: 40%;
}
.wrapper.article-24.p2 {
  /* hdArea */
}
.wrapper.article-24.p2 .hdArea .photo {
  background-position-y: 15%;
}
.wrapper.article-24.p2 .secBox p {
  /* interviewee */
}
.wrapper.article-24.p2 .secBox p.interviewee.personSP span {
  display: inline;
  position: static;
  margin-left: -2.5em;
  margin-right: 0.5em;
}
.wrapper.article-24.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
  font-size: 3.5vw;
}
.wrapper.article-24.p2 .linkOut:before {
  width: 34px;
  background-size: 25px 25px;
}
.wrapper.article-25 {
  /* hdArea */
}
.wrapper.article-25 .hdArea .titleArea h2 span.tag {
  font-feature-settings: "palt";
}
.wrapper.article-25 .hdArea .photo {
  background-image: url(article25_main.jpg);
  background-position: center 20%;
}
.wrapper.article-25.p1 .sec1 {
  margin-bottom: 60px;
}
.wrapper.article-25.p2 .figArea {
  width: 100%;
}
.wrapper.article-25.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
  font-size: 3.3vw;
}
.wrapper.article-25.p2 .linkOut:before {
  width: 40px;
  background-size: 35px 35px;
}
.wrapper.article-26 {
  /* hdArea */
}
.wrapper.article-26 .hdArea .photo {
  background-image: url(article26_main.jpg?0706);
  background-position: center 20%;
}
.wrapper.article-27 {
  /* hdArea */
}
.wrapper.article-27 .hdArea .photo {
  background-image: url(article27_main.jpg?0809);
  background-position: center 10%;
}
.wrapper.article-27.p2 .secBox p {
  /* interviewee */
}
.wrapper.article-27.p2 .secBox p.interviewee.personSP span {
  display: inline;
  position: static;
  margin-left: -2.5em;
  margin-right: 0.5em;
}
.wrapper.article-28 {
  /* hdArea */
}
.wrapper.article-28 .hdArea .photo {
  background-image: url(article28_main.jpg?0607);
  background-position: 63% top;
}
.wrapper.article-28.p2 h2 span.ttl {
  padding-top: 12px !important;
}
.wrapper.article-28.p2 h2 span.ttl > span strong {
  font-size: 23px;
}
.wrapper.article-28.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
  font-size: 3.5vw;
  padding: 10px 42px 10px 10px;
}
.wrapper.article-28.p2 .linkOut:before {
  width: 34px;
  background-size: 25px 25px;
}
.wrapper.article-29 {
  /* hdArea */
}
.wrapper.article-29 .hdArea .photo {
  background-image: url(article29_main.jpg?0731);
  background-position: 46% top;
}
.wrapper.article-29.p2 h2 span.ttl {
  padding-top: 12px !important;
}
.wrapper.article-29.p2 h2 span.ttl > span strong {
  font-size: 23px;
}
.wrapper.article-30 {
  /* hdArea */
}
.wrapper.article-30 br.pc {
  display: none;
}
.wrapper.article-30 .hdArea .photo {
  background-image: url(article30_main.jpg?1219);
  background-position: 46% top;
}
.wrapper.article-30.p2 .linkOut {
  min-height: 40px;
  margin-top: 60px;
  font-size: 3.5vw;
  padding: 10px 42px 10px 10px;
}
.wrapper.article-30.p2 .linkOut:before {
  width: 34px;
  background-size: 25px 25px;
}
.wrapper.article-31 {
  /* hdArea */
}
.wrapper.article-31 .hdArea .photo {
  background-image: url(article31_main.jpg?1217);
  background-position: 46% top;
}
.wrapper.thema .navListBox .navBar:before {
  background: #fff;
  background: linear-gradient(to bottom, #fff 0%, #333 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#fff", endColorstr="#333",GradientType=0 );
}
.wrapper.thema.case {
  background-color: #001848;
}
.wrapper.thema.case .navListBox .navBar {
  background-color: #001848;
}
.wrapper.thema.case .navListBox nav {
  background-color: #001848;
}
.wrapper.thema.case .navListBox nav h2 span:after {
  background-image: url(arrow_w-bold.svg);
}
.wrapper.thema.case .navListBox nav h2:after {
  background: #333;
  background: linear-gradient(to right, #333 0%, #fff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#333", endColorstr="#fff",GradientType=1 );
}

/* wrapper */
/* --------------------------------------
tb public
----------------------------------------- */
@media screen and (min-width: 640px) {
  .wrapper .only_sp {
    display: none;
  }
  .wrapper .only_pc {
    display: block;
  }
  .wrapper .navListBox .navBar .hamburger {
    position: fixed;
    top: 82px;
    right: 30px;
    margin: 0 auto;
    padding: 16px 2px;
    width: 45px;
    height: 45px;
    background-color: #000;
  }
  .wrapper .navListBox .navBar .hamburger span {
    width: 20px;
  }
  /* wrapper */
} /* min-width: 640px */
@media screen and (min-width: 1000px) and (max-width: 1200px) {
  .wrapper.indexPage .hdArea .inner .hd_logo {
    right: 100px;
  }
  .wrapper.indexPage .spissueArea {
    width: 900px !important;
    margin: 0 auto;
    /* articleList */
  }
  .wrapper.indexPage .spissueArea > h2 {
    width: 56% !important;
  }
  .wrapper.indexPage .spissueArea .articleList {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .wrapper.indexPage .spissueArea .articleList li {
    width: 47% !important;
  }
  .wrapper.indexPage .spissueArea .articleList li a .photo {
    max-width: none;
  }
  .wrapper.indexPage .contentArea {
    /* articleList */
  }
  .wrapper.indexPage .contentArea .articleList li {
    width: 30% !important;
  }
  .wrapper.indexPage .contentArea .articleList li a .photo {
    max-width: none;
    width: 100% !important;
    height: 20vw !important;
  }
  .wrapper.indexPage .navListBox nav {
    width: 40%;
  }
  .wrapper.indexPage .navListBox .navBar .hamburger {
    position: fixed;
    border: 1px solid #fff;
    top: 90px;
    right: 30px;
    margin: 0 auto;
    padding: 16px 2px;
    width: 45px;
    height: 45px;
    background-color: #000;
  }
  .wrapper.indexPage .navListBox .navBar .hamburger span {
    width: 20px;
    background-color: #fff;
  }
  /* wrapper */
} /* (min-width: 1000px)and(max-width: 1200px) */
@media screen and (max-width: 320px) {
  .wrapper.indexPage .hdArea .newContents a h3 .tag {
    font-size: 10px;
  }
  .wrapper.indexPage .contentArea.spissue h2 {
    width: 85%;
  }
  .wrapper .navListBox .navBar ul.snsList {
    width: 76px;
  }
  .wrapper .navListBox .navBar ul.snsList > p {
    width: 76px;
  }
  .wrapper .navListBox .navBar ul.snsList a {
    width: 36px !important;
  }
  .wrapper .navListBox .navBar ul li:last-child a {
    width: 70px !important;
  }
  .wrapper .navListBox nav ul li a .photo {
    width: 36%;
  }
  .wrapper .navListBox nav ul li a p {
    width: 61%;
  }
}
/* --------------------------------------
PC public
----------------------------------------- */
@media screen and (min-width: 641px) {
  body {
    min-width: 1024px;
  }
  .topAnimation ul {
    top: 45%;
    width: 510px;
  }
  .topAnimation ul li img {
    height: 55px;
  }
  .wrapper {
    font-family: "YuGothic", "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
    font-weight: 500;
    /* ==================
      navListBox
      ===================== */
    /* navListBox */
    /* ==================
    indexPage
    ===================== */
    /* indexPage */
    /* ==================
    article
    ===================== */
    /* article */
    /* p1 */
    /* p2 */
    /* ==================
    article-5
    ===================== */
    /* ==================
    article-4
    ===================== */
    /* ==================
    article-3
    ===================== */
    /* ==================
    article-1
    ===================== */
    /* ==================
    article-2
    ===================== */
    /* ==================
    article-6
    ===================== */
    /* article-6 */
    /* ==================
    article-7
    ===================== */
    /* article-7 */
    /* ==================
    article-8
    ===================== */
    /* article-8 */
    /* ==================
    article-9
    ===================== */
    /* article-9 */
    /* ==================
    article-10
    ===================== */
    /* article-10 */
    /* ==================
    article-11
    ===================== */
    /* article-11 */
    /* ==================
    article-12
    ===================== */
    /* article-12 */
    /* ==================
    article-13
    ===================== */
    /* article-13 */
    /* ==================
    article-14
    ===================== */
    /* article-14 */
    /* ==================
    article-15
    ===================== */
    /* article-15 */
    /* ==================
    article-16
    ===================== */
    /* article-16 */
    /* ==================
    article-17
    ===================== */
    /* article-17 */
    /* ==================
    article-18
    ===================== */
    /* ==================
    article-19
    ===================== */
    /* ==================
     article-20
     ===================== */
    /* ==================
    article-21
    ===================== */
    /* ==================
    article-22
    ===================== */
    /* ==================
    article-23
    ===================== */
    /* ==================
    article-24
    ===================== */
    /* ==================
    article-25
    ===================== */
    /* ==================
    article-26
    ===================== */
    /* ==================
    article-27
    ===================== */
    /* ==================
    article-28
    ===================== */
    /* ==================
    article-29
    ===================== */
    /* ==================
    article-30
    ===================== */
    /* ==================
    article-31
    ===================== */
  }
  .wrapper .navListBox {
    /* nav */
  }
  .wrapper .navListBox .navBar {
    min-width: 870px;
  }
  .wrapper .navListBox .navBar .linkList {
    width: auto;
  }
  .wrapper .navListBox .navBar .linkList li {
    display: block;
    margin-left: 10px;
  }
  .wrapper .navListBox .navBar .linkList li a {
    text-decoration: none;
  }
  .wrapper .navListBox .navBar .linkList li a.icon {
    width: auto !important;
    margin-left: 0;
  }
  .wrapper .navListBox .navBar .linkList li a.icon img {
    width: auto;
    height: 42px;
  }
  .wrapper .navListBox .navBar .snsList {
    top: 2px;
    height: 70px;
    width: 150px;
  }
  .wrapper .navListBox .navBar .snsList p {
    width: 150px;
    top: 5px;
    letter-spacing: 4px;
  }
  .wrapper .navListBox .navBar .snsList li a {
    margin-top: 5px;
    padding: 0 5px;
  }
  .wrapper .navListBox .navBar .snsList .fig {
    width: 70px;
    height: 70px;
  }
  .wrapper .navListBox .navBar .snsList .fig.fig_bf {
    transform: scale(-1, -1);
  }
  .wrapper .navListBox nav {
    padding-top: 100px;
    width: 40%;
  }
  .wrapper .navListBox nav .linkList {
    display: none;
  }
  .wrapper .navListBox nav h2 {
    width: 80%;
  }
  .wrapper .navListBox nav ul li {
    /* a */
  }
  .wrapper .navListBox nav ul li a .photo {
    margin-right: 0;
    max-width: 96px;
    width: 32%;
  }
  .wrapper .navListBox nav ul li a span {
    transition: all 0.3s;
  }
  .wrapper .navListBox nav ul li a p {
    width: 72%;
    font-size: 11px;
    transition: all 0.3s;
  }
  .wrapper .navListBox nav ul li a:hover span {
    opacity: 0.8;
  }
  .wrapper .navListBox nav ul li a:hover p {
    color: #00b0f0;
  }
  .wrapper .navListBox nav .indexLink a {
    transition: 0.3s;
  }
  .wrapper .navListBox nav .indexLink a:hover {
    color: #00b0f0;
  }
  .wrapper.indexPage {
    /* hdArea */
    /* thema */
    /* contentArea */
  }
  .wrapper.indexPage .hdArea {
    position: relative;
    margin-bottom: 70px;
    padding-bottom: 50px;
    box-sizing: border-box;
    /* textArea */
    /* newContents */
  }
  .wrapper.indexPage .hdArea .mainImg {
    max-height: none;
    height: 100%;
    background-position: top 30% right 10%;
  }
  .wrapper.indexPage .hdArea .inner {
    margin: 0 auto;
    width: 1000px;
  }
  .wrapper.indexPage .hdArea .inner .hd_logo {
    top: 20px;
    right: 9%;
  }
  .wrapper.indexPage .hdArea h1 {
    padding: 30px 0 0 10px;
    margin: 0px;
  }
  .wrapper.indexPage .hdArea .textArea {
    margin: 0 auto 0 10px;
    width: 600px;
    height: auto;
  }
  .wrapper.indexPage .hdArea .textArea .lead {
    margin: 0 0 40px 0;
    width: 100%;
    font-size: 15px;
  }
  .wrapper.indexPage .hdArea .newContents {
    width: 600px;
  }
  .wrapper.indexPage .hdArea .newContents h2 {
    display: table;
    margin: 0 auto 0 0;
    padding: 10px 100px 10px 10px;
    box-sizing: border-box;
    font-size: 18px;
  }
  .wrapper.indexPage .hdArea .newContents a .photo {
    height: 150px;
  }
  .wrapper.indexPage .hdArea .newContents a h3 {
    font-size: 16px;
  }
  .wrapper.indexPage .hdArea .newContents a h3 .tag {
    font-size: 17px;
    margin: 12px 0;
  }
  .wrapper.indexPage .hdArea .newContents > div:after {
    top: 10px;
    right: 10%;
    width: 20px;
    height: 20px;
  }
  .wrapper.indexPage .hdArea .newContents .bx-wrapper .bx-viewport {
    height: 150px !important;
  }
  .wrapper.indexPage.thema .hdArea .textArea .lead {
    font-size: 19px;
  }
  .wrapper.indexPage.thema .hdArea .textArea .lead span {
    font-size: 40px;
  }
  .wrapper.indexPage .contentArea {
    margin: 0 0 100px 0;
    position: relative;
    /* articleList */
  }
  .wrapper.indexPage .contentArea > h2 {
    margin: 0 0 60px 0;
    padding: 0 0 5px 0;
    width: 40%;
  }
  .wrapper.indexPage .contentArea > h2 span {
    padding: 0;
  }
  .wrapper.indexPage .contentArea > h2 span img {
    display: block;
    margin: 0 0 0 calc(100% - 400px);
    width: auto;
    height: 35px;
  }
  .wrapper.indexPage .contentArea .themaArea {
    width: 490px;
    position: absolute;
    top: 10px;
    left: calc(50% - 20px);
    margin: 0;
  }
  .wrapper.indexPage .contentArea .themaArea a:hover {
    opacity: 0.7;
  }
  .wrapper.indexPage .contentArea .inner {
    max-width: 1100px;
  }
  .wrapper.indexPage .contentArea .articleList {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    /*li */
  }
  .wrapper.indexPage .contentArea .articleList li {
    margin: 0 1.5% 40px 1.5%;
    width: 27%;
    /* article-5 */
  }
  .wrapper.indexPage .contentArea .articleList li.article-5 a .photo {
    background-image: url(article5_main.jpg);
  }
  .wrapper.indexPage .contentArea .articleList a {
    display: block;
    overflow: hidden;
  }
  .wrapper.indexPage .contentArea .articleList a:before {
    width: 2px;
    height: 100%;
    transition: 0.3s;
  }
  .wrapper.indexPage .contentArea .articleList a:after {
    left: 0;
    bottom: 0;
    transition: 0.3s;
    transform: translateX(-100%);
  }
  .wrapper.indexPage .contentArea .articleList a:hover .btn {
    bottom: 12px;
  }
  .wrapper.indexPage .contentArea .articleList a:hover h2:after {
    transform: translateX(0);
  }
  .wrapper.indexPage .contentArea .articleList a .newIco {
    width: 65px;
  }
  .wrapper.indexPage .contentArea .articleList a .photo {
    width: 100%;
    max-height: 146px;
    background-repeat: no-repeat;
  }
  .wrapper.indexPage .contentArea .articleList a .photo.photo_02 {
    background-position: top 60% center;
  }
  .wrapper.indexPage .contentArea .articleList a .photo.photo_03 {
    background-position: top 50% center;
  }
  .wrapper.indexPage .contentArea .articleList a .new {
    bottom: auto;
    top: 0;
  }
  .wrapper.indexPage .contentArea .articleList a h2 {
    position: relative;
    width: calc(100% - 18px);
    padding: 10px 5px 30px 15px;
    font-size: 16px;
    height: 105px;
  }
  .wrapper.indexPage .contentArea .articleList a h2:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #002060 0%, #005187 100%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    transform: translateX(-100%);
    transition: 0.3s;
  }
  .wrapper.indexPage .contentArea .articleList a h2 span {
    position: relative;
    z-index: 1;
  }
  .wrapper.indexPage .contentArea .articleList a h2 .tag {
    display: table;
    margin: 4px 0 10px 0;
    box-sizing: border-box;
    font-size: 15px;
  }
  .wrapper.indexPage .contentArea .articleList a h2 .tag.tag2 {
    font-size: 16.5px;
  }
  .wrapper.indexPage .contentArea .articleList a h2 .tag.tag2-2 {
    margin: 2px 0 4px 0;
  }
  .wrapper.indexPage .contentArea .articleList a .btn {
    display: inline-block;
    position: absolute;
    bottom: 6px;
    right: 15px;
    transition: 0.2s;
  }
  .wrapper.indexPage .contentArea .articleList a .btn img {
    display: block;
    width: auto;
    height: 18px;
  }
  .wrapper.indexPage .contentArea.spissue h2 {
    width: 40%;
  }
  .wrapper.indexPage .contentArea.spissue > p {
    display: inline-block;
    width: 40%;
  }
  .wrapper.indexPage .contentArea.spissue > p span {
    margin: 0 0 20px calc(100% - 400px);
  }
  .wrapper.article {
    padding-right: 100px;
    /* hdArea */
    /* figAreaLead */
    /* linkNext */
    /* pagenationList */
    /* bannerArea */
    /* linkOther */
  }
  .wrapper.article .hdArea {
    position: relative;
    margin: 0 auto 60px auto;
    /* titleArea */
  }
  .wrapper.article .hdArea h1 {
    position: absolute;
    top: 35px;
    left: calc(50% - 440px);
    padding: 0;
    height: auto;
  }
  .wrapper.article .hdArea h1 img {
    height: 79px;
  }
  .wrapper.article .hdArea .photo {
    margin: 0 0 0 auto;
    width: 60%;
  }
  .wrapper.article .hdArea .titleArea {
    position: absolute;
    bottom: 40px;
    width: 100%;
  }
  .wrapper.article .hdArea .titleArea h2 {
    position: relative;
    padding: 20px 0px;
    width: 50%;
  }
  .wrapper.article .hdArea .titleArea h2:before {
    width: 80%;
  }
  .wrapper.article .hdArea .titleArea h2 span {
    display: block;
  }
  .wrapper.article .hdArea .titleArea h2 span.tag {
    left: calc(100% - 428px);
    padding: 10px 15px;
    font-size: 16px;
  }
  .wrapper.article .hdArea .titleArea h2 span.ttl {
    padding: 40px 0px 20px 0;
  }
  .wrapper.article .hdArea .titleArea h2 span.ttl > span {
    display: inline-block;
    margin-left: calc(100% - 428px);
    margin-right: auto;
    box-sizing: border-box;
    width: auto;
    font-size: 2.6vw;
  }
  .wrapper.article .hdArea .titleArea h2 span.ttl .small {
    margin-bottom: 0.5em;
  }
  .wrapper.article .hdArea.sample {
    margin: 0 auto 60px auto;
  }
  .wrapper.article .hdArea.sample .photo {
    width: 54%;
  }
  .wrapper.article .hdArea.sample h1 {
    height: auto;
  }
  .wrapper.article .hdArea.sample h1 a {
    width: 170px;
    height: auto;
  }
  .wrapper.article .hdArea.sample .titleArea {
    bottom: 80px;
  }
  .wrapper.article .hdArea.sample .titleArea h2 {
    padding: 0 0 10px 0;
    width: 54%;
  }
  .wrapper.article .hdArea.sample .titleArea h2 span.ttl {
    padding: 40px 0px 35px 0;
  }
  .wrapper.article .hdArea.sample .titleArea h2 span.ttl .tag {
    left: auto;
    font-size: 18px !important;
    margin-bottom: 32px;
    display: inline-block;
    top: -20px;
    padding: 6px 10px;
  }
  .wrapper.article .hdArea.sample .titleArea h2 span.ttl .tag small {
    font-size: 15px;
    margin-right: 0.8em;
  }
  .wrapper.article .hdArea.sample .titleArea h2 span.ttl > span {
    line-height: 1.6;
    margin-left: calc(100% - 462px);
    font-size: 26px;
  }
  .wrapper.article .hdArea.sample.sample_2 .titleArea h2 span.ttl > span {
    font-size: 28px;
  }
  .wrapper.article .figAreaLead {
    margin-bottom: 50px;
    padding: 20px 0px;
  }
  .wrapper.article .figAreaLead img {
    display: block;
    margin: 0 auto;
    width: 700px;
  }
  .wrapper.article .lead {
    margin: 0 auto 80px auto;
    width: 700px;
  }
  .wrapper.article .secBox {
    margin-left: auto;
    margin-right: auto;
    padding: 60px 0;
    max-width: 900px;
    width: 100%;
    /* infoBox */
  }
  .wrapper.article .secBox h2 {
    padding-left: 100px;
  }
  .wrapper.article .secBox h2:before {
    width: 8%;
  }
  .wrapper.article .secBox h2 span {
    font-size: 30px;
  }
  .wrapper.article .secBox .innerArea {
    margin: 0 auto;
    width: 700px;
  }
  .wrapper.article .secBox .figArea {
    max-width: 700px;
    width: 100%;
  }
  .wrapper.article .secBox .figArea .figCaption {
    padding: 20px 20px;
  }
  .wrapper.article .secBox .photoArea {
    display: flex;
  }
  .wrapper.article .secBox .photoArea img {
    width: 430px;
  }
  .wrapper.article .secBox .photoArea .profileText {
    padding: 15px 20px 5px 20px;
    width: 323px;
  }
  .wrapper.article .secBox .photoArea .p_only15 {
    width: 324px;
  }
  .wrapper.article .secBox .infoBox {
    margin-bottom: 50px;
    padding: 25px 30px;
  }
  .wrapper.article .secBox .infoBox:last-of-type {
    margin-bottom: 0;
  }
  .wrapper.article .secBox .infoBox h3 {
    text-align: center;
  }
  .wrapper.article .secBox .infoBox p {
    margin-bottom: 30px;
  }
  .wrapper.article .secBox .infoBox a {
    padding: 10px 20px;
    width: 400px;
    transition: 0.3s;
  }
  .wrapper.article .secBox .infoBox a:hover {
    background-color: #00b0f0;
  }
  .wrapper.article .secBox .bgnOut {
    margin-top: 60px;
    padding: 15px 20px;
    width: 400px;
    font-size: 18px;
    transition: 0.3s;
  }
  .wrapper.article .secBox .bgnOut:hover {
    background-color: #00b0f0;
  }
  .wrapper.article .secBox .flexWrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .wrapper.article .linkNext {
    margin-top: 60px;
  }
  .wrapper.article .linkNext a {
    width: 368px;
    font-weight: bold;
    font-size: 20px;
    transition: 0.3s;
  }
  .wrapper.article .linkNext a:hover {
    background-color: rgba(0, 176, 240, 0.2);
  }
  .wrapper.article .linkNext a:hover span {
    transform: translateX(5px);
  }
  .wrapper.article .linkNext a span {
    top: 20px;
    left: -90px;
    width: 110px;
    text-align: center;
    line-height: 1.5;
    font-weight: normal;
    transition: 0.3s;
  }
  .wrapper.article .next_only15 a {
    width: 410px;
  }
  .wrapper.article .linkOut {
    margin-top: 80px;
    padding-left: 35px;
    width: 360px;
    line-height: 1.3;
    font-size: 20px;
    transition: 0.3s;
  }
  .wrapper.article .linkOut:hover {
    opacity: 0.8;
  }
  .wrapper.article .pagenationList {
    margin: 80px auto;
  }
  .wrapper.article .pagenationList li a {
    padding: 4px 0;
    line-height: 1.5;
    font-size: 20px;
    transition: 0.3s;
  }
  .wrapper.article .pagenationList li a:hover {
    background-color: #00b0f0;
  }
  .wrapper.article .pagenationList li.indexLink a:hover {
    background-color: transparent;
    color: #00b0f0;
  }
  .wrapper.article .bannerArea {
    display: flex;
    flex-wrap: wrap;
    max-width: 630px;
    margin: 0 auto 80px auto;
  }
  .wrapper.article .bannerArea li {
    margin: 0 auto 20px auto;
    width: 47%;
    min-height: 94px;
  }
  .wrapper.article .bannerArea li:nth-of-type(3) a {
    border: 0;
    background-color: #555555;
    text-align: center;
    font-size: 16px;
    color: #cccccc;
  }
  .wrapper.article .bannerArea li:nth-of-type(3) a:after {
    content: none;
  }
  .wrapper.article .bannerArea li.logo a {
    font-size: 18px;
  }
  .wrapper.article .bannerArea a {
    padding: 15px 20px 5px 15px;
    height: 100%;
    font-size: 22px;
    transition: 0.3s;
  }
  .wrapper.article .bannerArea a:hover {
    opacity: 0.8;
    transform: translateY(1px);
  }
  .wrapper.article .bannerArea.bannerArea2 {
    right: 110px;
    display: block;
    position: fixed;
    width: 116px;
    bottom: 3%;
  }
  .wrapper.article .bannerArea.bannerArea2 li {
    margin: 0;
    width: auto;
    min-height: 50px;
  }
  .wrapper.article .bannerArea.bannerArea2 li a {
    font-size: 12px;
    text-align: left;
  }
  .wrapper.article .bannerArea.bannerArea2 li:nth-of-type(3) a {
    border: 1px solid #ffffff;
    background: linear-gradient(to right, #002060 0%, #00b0f0 100%);
    text-align: left;
    color: #fff;
  }
  .wrapper.article .bannerArea.bannerArea_re {
    display: block;
  }
  .wrapper.article .bannerArea.bannerArea_re a {
    padding-bottom: 15px;
  }
  .wrapper.article .link_article ul {
    display: flex;
  }
  .wrapper.article .link_article li {
    width: 49%;
  }
  .wrapper.article .link_article li + li {
    margin-top: 0;
    margin-left: 2%;
  }
  .wrapper.article .linkOther {
    width: 360px;
    font-size: 20px;
    transition: 0.3s;
  }
  .wrapper.article .linkOther:first-of-type {
    margin-top: 80px;
  }
  .wrapper.article .linkOther span {
    padding: 10px 10px 10px 15px;
  }
  .wrapper.article .linkOther span.title {
    padding: 10px 10px 10px 15px;
    font-size: 18px;
  }
  .wrapper.article .linkOther span.title:after {
    top: 8px;
    font-size: 20px;
    transition: 0.3s;
  }
  .wrapper.article .linkOther:hover {
    transform: translateY(1px);
    opacity: 0.9;
  }
  .wrapper.article .linkOther:hover span.title:after {
    right: 5px;
  }
  .wrapper.p1 {
    /* secBox */
  }
  .wrapper.p1 .hdArea .photo {
    height: 500px;
  }
  .wrapper.p1 .secBox {
    /* photoArea */
  }
  .wrapper.p1 .secBox .photoArea.phR {
    flex-direction: row-reverse;
  }
  .wrapper.p1 .secBox .photoArea.phR img {
    margin: 0 0 0 auto;
  }
  .wrapper.p1 .secBox .photoArea.phL img {
    margin: 0 auto 0 0;
  }
  .wrapper.p2 {
    /* hdArea */
  }
  .wrapper.p2 .hdArea {
    /* titleArea */
  }
  .wrapper.p2 .hdArea h1 {
    top: 20px;
  }
  .wrapper.p2 .hdArea h1 img {
    height: 97px;
  }
  .wrapper.p2 .hdArea .photo {
    height: 300px;
  }
  .wrapper.p2 .hdArea .titleArea {
    bottom: 10px;
  }
  .wrapper.p2 .hdArea .titleArea h2 {
    /* span */
  }
  .wrapper.p2 .hdArea .titleArea h2 span.tag {
    padding: 4px 15px;
    font-size: 14px;
  }
  .wrapper.p2 .hdArea .titleArea h2 span.ttl {
    padding-top: 25px;
  }
  .wrapper.p2 .hdArea .titleArea h2 span.ttl > span {
    font-size: 26px;
  }
  .wrapper.article-5 {
    /* p2 */
  }
  .wrapper.article-5.p1 {
    /* secArea */
  }
  .wrapper.article-5.p1 .secArea h2 br {
    display: none;
  }
  .wrapper.article-5.p1 .secArea p {
    /* interviewee */
  }
  .wrapper.article-5.p1 .secArea p.interviewee.personSP {
    padding-top: 0;
  }
  .wrapper.article-5.p1 .secArea p.interviewee.personSP span {
    display: inline;
    position: static;
    margin-left: -2.5em;
    margin-right: 0.5em;
  }
  .wrapper.article-5.p1 .secArea .innerArea {
    position: relative;
  }
  .wrapper.article-5.p1 .secArea .pcWrap {
    position: relative;
    padding-bottom: 360px;
  }
  .wrapper.article-5.p1 .secArea .photoArea {
    margin: 0;
  }
  .wrapper.article-5.p1 .secArea .photoArea.phR {
    align-items: start;
    position: absolute;
    bottom: 0;
    right: 0;
    margin-bottom: 30px;
  }
  .wrapper.article-5.p1 .secArea .photoArea.phL {
    align-items: flex-end;
    margin-bottom: 60px;
  }
  .wrapper.article-5.p2 {
    /* titleArea */
  }
  .wrapper.article-5.p2 .hdArea .photo {
    background-position: top 16% center;
  }
  .wrapper.article-5.p2 .titleArea h2 span {
    /* ttl */
  }
  .wrapper.article-5.p2 .titleArea h2 span.ttl {
    width: 90%;
  }
  .wrapper.article-5.p2 .titleArea h2 span.ttl > span {
    margin-left: calc(90% - 344px);
  }
  .wrapper.article-4 {
    /* p2 */
  }
  .wrapper.article-4 .hdArea .photo {
    background-position: center;
  }
  .wrapper.article-4.p1 {
    /* secArea */
  }
  .wrapper.article-4.p1 .figArea {
    margin-bottom: 80px;
  }
  .wrapper.article-4.p1 .secArea p {
    /* interviewee */
  }
  .wrapper.article-4.p1 .secArea p.interviewee.personSP {
    padding-top: 0;
  }
  .wrapper.article-4.p1 .secArea p.interviewee.personSP span {
    display: inline;
    position: static;
    margin-left: -2.5em;
    margin-right: 0.5em;
  }
  .wrapper.article-4.p1 .secArea .innerArea {
    position: relative;
  }
  .wrapper.article-4.p1 .secArea .pcWrap {
    position: relative;
    padding-bottom: 340px;
  }
  .wrapper.article-4.p1 .secArea .photoArea {
    margin: 0;
  }
  .wrapper.article-4.p1 .secArea .photoArea.phR {
    align-items: flex-end;
    margin-bottom: 60px;
  }
  .wrapper.article-4.p1 .secArea .photoArea.phL {
    align-items: start;
    position: absolute;
    bottom: 0;
    left: 0;
  }
  .wrapper.article-4.p1 .sec1 h2 br:nth-of-type(2) {
    display: none;
  }
  .wrapper.article-4.p2 {
    /* titleArea */
  }
  .wrapper.article-4.p2 .hdArea .photo {
    background-position: top 30% center;
  }
  .wrapper.article-4.p2 .titleArea h2 span {
    /* ttl */
  }
  .wrapper.article-4.p2 .titleArea h2 span.ttl {
    width: 85%;
  }
  .wrapper.article-4.p2 .titleArea h2 span.ttl > span {
    margin-left: calc(85% - 344px);
  }
  .wrapper.article-4.p2 .secBox .infoBox:first-of-type {
    margin-top: 60px;
  }
  .wrapper.article-4 .linkNext a {
    width: 428px;
  }
  .wrapper.article-4 .linkNext a span {
    top: 30%;
  }
  .wrapper.article-3 {
    /* p2 */
  }
  .wrapper.article-3.p1 {
    /* secArea */
  }
  .wrapper.article-3.p1 .lead {
    margin-bottom: 50px;
  }
  .wrapper.article-3.p1 .introImg {
    margin-bottom: 80px;
  }
  .wrapper.article-3.p1 .secArea .innerArea {
    position: relative;
  }
  .wrapper.article-3.p1 .secArea .pcWrap {
    position: relative;
    padding-bottom: 360px;
  }
  .wrapper.article-3.p1 .secArea .photoArea {
    margin: 0;
  }
  .wrapper.article-3.p1 .secArea .photoArea.phR {
    align-items: flex-end;
    position: relative;
    bottom: 0;
    right: 0;
    margin-bottom: 60px;
  }
  .wrapper.article-3.p1 .secArea .photoArea.phL {
    align-items: start;
    position: absolute;
    bottom: 0;
    left: 0;
    margin-bottom: 0px;
  }
  .wrapper.article-3 .linkNext a {
    width: 428px;
  }
  .wrapper.article-3 .linkNext a span {
    top: 30%;
  }
  .wrapper.article-3.p2 {
    /* titleArea */
    /* flexWrap */
  }
  .wrapper.article-3.p2 .hdArea .photo {
    background-position: top 40% center;
  }
  .wrapper.article-3.p2 .figArea {
    max-width: 740px;
  }
  .wrapper.article-3.p2 .titleArea h2 span {
    /* ttl */
  }
  .wrapper.article-3.p2 .titleArea h2 span.ttl {
    width: 85%;
  }
  .wrapper.article-3.p2 .titleArea h2 span.ttl > span {
    margin-left: calc(85% - 344px);
  }
  .wrapper.article-3.p2 .flexWrap .textWrap {
    width: 45%;
  }
  .wrapper.article-3.p2 .flexWrap .figArea {
    margin: 0;
    width: 55%;
  }
  .wrapper.article-3.p2 .flexWrap .figArea img {
    display: block;
    margin: 0 0 0 auto;
    width: 350px;
  }
  .wrapper.article-1 .sec1 {
    margin-bottom: 80px;
  }
  .wrapper.article-2.p1 .photoArea.phL {
    align-items: flex-end;
  }
  .wrapper.article-2.p2 .hdArea .photo {
    background-position: top 40% center;
  }
  .wrapper.article-6 {
    /* p2 */
  }
  .wrapper.article-6.p1 .photoArea.phR {
    align-items: flex-end;
  }
  .wrapper.article-6.p1 .linkNext a {
    width: 398px;
  }
  .wrapper.article-6.p2 .hdArea .photo {
    background-position: top 25% center;
  }
  .wrapper.article-6.p2 .linkOut {
    width: 350px;
    font-size: 18px;
  }
  .wrapper.article-7 {
    /* linkOhterFlex */
  }
  .wrapper.article-7 .linkOut {
    margin-top: 30px;
    padding-left: 15px;
  }
  .wrapper.article-7 .secBox.sec1 {
    margin-bottom: 80px;
  }
  .wrapper.article-7 .linkOhterFlex {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 60px;
  }
  .wrapper.article-7 .linkOhterFlex a {
    margin: 0 !important;
    width: 340px;
  }
  .wrapper.article-7 .linkOhterFlex a span {
    font-size: 18px;
  }
  .wrapper.article-7 .linkOhterFlex a span.title {
    font-size: 16px;
  }
  .wrapper.article-8 {
    /* linkOhterFlex */
    /* linkOhterFlex */
  }
  .wrapper.article-8 .hdArea .titleArea h2 {
    width: 55%;
  }
  .wrapper.article-8 .hdArea .titleArea h2:before {
    width: 73%;
  }
  .wrapper.article-8 .hdArea .titleArea h2 span.tag {
    left: calc(100% - 480px);
  }
  .wrapper.article-8 .hdArea .titleArea h2 span.ttl > span {
    margin-left: calc(100% - 480px);
  }
  .wrapper.article-8 .secBox.sec1 {
    margin-bottom: 80px;
  }
  .wrapper.article-8 .linkOhterFlex {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 60px;
  }
  .wrapper.article-8 .linkOhterFlex a {
    margin: 0 !important;
    width: 340px;
  }
  .wrapper.article-8 .linkOhterFlex a span {
    font-size: 18px;
  }
  .wrapper.article-8 .linkOhterFlex a span.title {
    font-size: 16px;
  }
  .wrapper.article-8 .linkOut {
    margin-top: 0;
    padding-left: 20px;
  }
  .wrapper.article-8 .contentLinkArea {
    margin-top: 60px;
    padding-right: 15px;
    padding-left: 15px;
  }
  .wrapper.article-8 .contentLinkArea h3 {
    font-size: 18px;
  }
  .wrapper.article-9 {
    /* hdArea */
  }
  .wrapper.article-9 .hdArea .photo {
    background-position: top center;
    background-size: cover;
  }
  .wrapper.article-9 .secBox.sec1 {
    margin-bottom: 80px;
  }
  .wrapper.article-9 .secBox .photoArea.phL {
    align-items: flex-start;
  }
  .wrapper.article-9 .secBox .photoArea.phR {
    align-items: flex-end;
  }
  .wrapper.article-9 .linkNext a {
    width: 408px;
  }
  .wrapper.article-9.p2 {
    /* hdArea */
  }
  .wrapper.article-9.p2 .hdArea .photo {
    background-size: cover;
  }
  .wrapper.article-10 {
    /* p1 */
    /* p2 */
  }
  .wrapper.article-10.p1 .pcWrap {
    position: relative;
    padding-bottom: 360px;
  }
  .wrapper.article-10.p1 .secBox {
    /* photoArea */
  }
  .wrapper.article-10.p1 .secBox.sec1 {
    margin-bottom: 80px;
  }
  .wrapper.article-10.p1 .secBox .photoArea.phL {
    position: absolute;
    bottom: 0;
    left: 0;
    margin-bottom: 0px;
  }
  .wrapper.article-10.p1 .secBox .photoArea.phR {
    align-items: flex-end;
  }
  .wrapper.article-10.p1 .linkNext a {
    padding: 10px 30px 10px 55px;
    width: 418px;
  }
  .wrapper.article-10.p2 .hdArea .photo {
    background-position: top 35% center;
  }
  .wrapper.article-10.p2 .hdArea .titleArea h2 span.ttl > span {
    font-size: 25px;
  }
  .wrapper.article-11 {
    /* hdArea */
  }
  .wrapper.article-11 .hdArea .photo {
    background-position: center;
  }
  .wrapper.article-11 .linkNext a {
    width: 460px;
  }
  .wrapper.article-11.p1 .pcWrap {
    position: relative;
    padding-bottom: 320px;
  }
  .wrapper.article-11.p1 .secBox {
    /* photoArea */
  }
  .wrapper.article-11.p1 .secBox.sec1 {
    margin-bottom: 80px;
  }
  .wrapper.article-11.p1 .secBox .photoArea.phL {
    position: absolute;
    bottom: 0;
    left: 0;
    margin-bottom: 0px;
  }
  .wrapper.article-11.p1 .secBox .photoArea.phR {
    align-items: flex-end;
  }
  .wrapper.article-12 {
    /* hdArea */
    /* p2 */
  }
  .wrapper.article-12 .hdArea {
    /* titleArea */
  }
  .wrapper.article-12 .hdArea h1 {
    left: calc(50% - 440px);
  }
  .wrapper.article-12 .hdArea .photo {
    background-position: top 15% right;
    background-size: cover;
  }
  .wrapper.article-12 .hdArea .titleArea h2 span.tag {
    left: calc(100% - 428px);
  }
  .wrapper.article-12 .hdArea .titleArea h2 span.ttl > span {
    margin-left: calc(100% - 428px);
  }
  .wrapper.article-12.p2 .hdArea .titleArea h2 span.ttl > span {
    font-size: 23px;
    line-height: 1.3;
  }
  .wrapper.article-12.p2 .linkOut:first-of-type {
    margin-bottom: 30px;
    font-size: 17px;
  }
  .wrapper.article-12.p2 .linkOut:nth-of-type(2) {
    margin-top: 0;
  }
  .wrapper.article-13.p2 .linkOut {
    margin-bottom: 30px;
    font-size: 17px;
  }
  .wrapper.article-14 .linkNext a {
    width: 430px;
  }
  .wrapper.article-14.p2 .linkOut {
    margin-bottom: 30px;
    font-size: 17px;
    width: 440px;
    padding-right: 0;
  }
  .wrapper.article-14.p2 .linkOut br.pc {
    display: block;
  }
  .wrapper.article-14.p2 .secBox {
    /* photoArea */
  }
  .wrapper.article-14.p2 .secBox .photoArea.phL {
    flex-direction: row-reverse;
  }
  .wrapper.article-15 {
    /* hdArea */
  }
  .wrapper.article-15 .hdArea .photo {
    background-image: url(article15_main.jpg?060601);
    background-size: cover;
    background-position: 75% 15%;
  }
  .wrapper.article-15.p2 .photo {
    background-size: 100% auto;
    background-position: 50% 15%;
  }
  .wrapper.article-15.p2 .linkOut {
    margin-bottom: 30px;
    font-size: 17px;
  }
  .wrapper.article-15.p2 .secBox {
    /* photoArea */
  }
  .wrapper.article-15.p2 .secBox .photoArea.phR {
    flex-direction: row-reverse;
  }
  .wrapper.article-16 {
    /* hdArea */
  }
  .wrapper.article-16 .hdArea .photo {
    background-image: url(article16_main.jpg);
    background-size: cover;
    background-position: 65% 15%;
  }
  .wrapper.article-16 .hdArea .titleArea h2 span.ttl > span {
    font-size: 2.5vw;
  }
  .wrapper.article-16 .linkNext a {
    width: 430px;
  }
  .wrapper.article-16.p2 .photo {
    background-size: 100% auto;
    background-position: 50% 15%;
  }
  .wrapper.article-16.p2 .linkOut {
    margin-bottom: 30px;
    font-size: 17px;
  }
  .wrapper.article-16.p2 .secBox {
    /* photoArea */
  }
  .wrapper.article-16.p2 .secBox .photoArea.phR {
    flex-direction: row-reverse;
  }
  .wrapper.article-17 {
    /* hdArea */
  }
  .wrapper.article-17 .hdArea .photo {
    background-image: url(article17_main.jpg?0810);
    background-size: cover;
    background-position: 65% 15%;
  }
  .wrapper.article-17.p2 .linkOut {
    margin-bottom: 30px;
    font-size: 17px;
    width: 450px;
  }
  .wrapper.article-17.p2 .linkOut.linkOut2 small {
    font-size: 14px;
  }
  .wrapper.article-17.p2 .secBox {
    /* photoArea */
  }
  .wrapper.article-17.p2 .secBox p.personSP.only_17_p2 span {
    margin-left: -2.5em;
    margin-right: 0.5em;
    display: inline;
    position: static;
  }
  .wrapper.article-17.p2 .secBox .photoArea.phR {
    flex-direction: row-reverse;
  }
  .wrapper.article-18 .hdArea .photo {
    background-image: url(article18_main.jpg?0922);
    background-size: cover;
    background-position: 65% 15%;
  }
  .wrapper.article-18.p2 .linkOut {
    margin-bottom: 30px;
    font-size: 17px;
    width: 440px;
    padding-right: 0;
  }
  .wrapper.article-18.p2 .linkOut br.pc {
    display: block;
  }
  .wrapper.article-18.p2 .secBox {
    /* photoArea */
  }
  .wrapper.article-18.p2 .secBox .photoArea.phR {
    flex-direction: row-reverse;
  }
  .wrapper.article-19 .hdArea .photo {
    background-image: url(article19_main.jpg?0922);
    background-size: cover;
    background-position: 65% 15%;
  }
  .wrapper.article-19.p2 .hdArea .photo {
    background-position: 100% 25%;
  }
  .wrapper.article-19.p2 .hdArea .titleArea h2 span.ttl > span {
    font-size: 23px !important;
  }
  .wrapper.article-19.p2 .secBox .photoArea.phR {
    flex-direction: row-reverse;
  }
  .wrapper.article-19 .linkNext a {
    width: 400px;
  }
  .wrapper.article-20.p2 .secBox {
    /* photoArea */
  }
  .wrapper.article-20.p2 .secBox .photoArea.phL {
    flex-direction: row-reverse;
  }
  .wrapper.article-20.p2 .linkOut {
    margin-bottom: 30px;
    font-size: 17px;
    padding-right: 40px;
    padding-left: 20px;
    width: 390px;
  }
  .wrapper.article-20.p2 .linkOut br.pc {
    display: block;
  }
  .wrapper.article-20.p2 .linkOut.linkOut_1 {
    font-size: 15px;
  }
  .wrapper.article-21 .linkOut {
    margin-bottom: 30px;
    font-size: 17px;
    padding-right: 40px;
    padding-left: 20px;
    width: 390px;
  }
  .wrapper.article-21 .linkOut br.pc {
    display: block;
  }
  .wrapper.article-21 .linkOut.linkOut_1 {
    font-size: 18px;
  }
  .wrapper.article-22 .hdArea .titleArea h2 span.ttl > span {
    font-size: 2.5vw;
  }
  .wrapper.article-22 .linkNext a {
    width: 460px;
  }
  .wrapper.article-22.p2 .linkOut {
    width: 380px;
    font-size: 18px;
  }
  .wrapper.article-23.p2 .secBox .photoArea.phL {
    flex-direction: row-reverse;
  }
  .wrapper.article-23.p2 .linkOut {
    width: 500px;
    font-size: 18px;
  }
  .wrapper.article-24.p2 .hdArea .titleArea h2 span.ttl > span {
    font-size: 24px;
  }
  .wrapper.article-24.p2 .secBox .photoArea.phL {
    flex-direction: row-reverse;
  }
  .wrapper.article-24.p2 .linkOut {
    width: 410px;
    font-size: 18px;
    padding-right: 50px;
  }
  .wrapper.article-25 .hdArea .titleArea {
    bottom: 100px;
  }
  .wrapper.article-25 .hdArea .titleArea h2 span.tag {
    font-size: 15px;
  }
  .wrapper.article-25 .hdArea .titleArea h2 span.ttl > span {
    font-size: 28px;
  }
  .wrapper.article-25.p2 .hdArea .titleArea {
    bottom: 30px;
  }
  .wrapper.article-25.p2 .secBox {
    /* photoArea */
  }
  .wrapper.article-25.p2 .secBox .photoArea.phL {
    flex-direction: row-reverse;
    align-items: stretch;
  }
  .wrapper.article-25.p2 .secBox .photoArea.phL img {
    height: 100%;
    object-fit: cover;
    object-position: right top;
  }
  .wrapper.article-25.p2 .secBox .photoArea.phR {
    align-items: stretch;
  }
  .wrapper.article-25.p2 .secBox .photoArea.phR img {
    height: 100%;
    object-fit: cover;
    object-position: left top;
  }
  .wrapper.article-25.p2 .linkOut {
    margin-bottom: 30px;
    font-size: 17px;
    padding-right: 40px;
    padding-left: 20px;
    width: 400px;
  }
  .wrapper.article-25.p2 .linkOut br.pc {
    display: block;
  }
  .wrapper.article-25.p2 .linkOut.linkOut_1 {
    font-size: 18px;
  }
  .wrapper.article-26.p2 .linkOut {
    width: 540px;
    font-size: 18px;
    padding-right: 50px;
  }
  .wrapper.article-26.p2 .linkOut:before {
    width: 40px;
    background-size: 35px 35px;
  }
  .wrapper.article-27.p2 .secBox .photoArea.phR {
    flex-direction: row-reverse;
  }
  .wrapper.article-28.p2 h2 span.ttl {
    padding-top: 25px !important;
  }
  .wrapper.article-28.p2 h2 span.ttl > span strong {
    font-size: 28px;
  }
  .wrapper.article-28.p2 .secBox .photoArea.phR {
    flex-direction: row-reverse;
  }
  .wrapper.article-28.p2 .linkOut {
    width: 500px;
    font-size: 18px;
    padding-left: 35px;
  }
  .wrapper.article-28.p2 .linkOut:before {
    width: 40px;
    background-size: 32px 32px;
  }
  .wrapper.article-29.p2 h2 span.ttl {
    padding-top: 25px !important;
  }
  .wrapper.article-29.p2 h2 span.ttl > span strong {
    font-size: 28px;
  }
  .wrapper.article-30 br.sp {
    display: none;
  }
  .wrapper.article-30 br.pc {
    display: block;
  }
  .wrapper.article-30 .linkNext a {
    width: 400px;
  }
  .wrapper.article-30.p2 h2 span.ttl {
    padding-top: 25px !important;
  }
  .wrapper.article-30.p2 h2 span.ttl > span strong {
    font-size: 24px;
  }
  .wrapper.article-30.p2 .secBox .photoArea.phR {
    flex-direction: row-reverse;
  }
  .wrapper.article-30.p2 .linkOut {
    width: 350px;
    font-size: 18px;
    padding-left: 35px;
  }
  .wrapper.article-30.p2 .linkOut:before {
    width: 40px;
    background-size: 32px 32px;
  }
  .wrapper.article-31 .linkNext a {
    width: 425px;
  }
  .wrapper.article-31 .linkNext a br.sp {
    display: none;
  }
  .wrapper.article-31.p2 h2 span.ttl {
    padding-top: 25px !important;
  }
  .wrapper.article-31.p2 h2 span.ttl > span strong {
    font-size: 28px;
  }
  /* wrapper */
} /* min-width: 641px */
@media screen and (min-width: 1100px) {
  .wrapper {
    /* ==================
    article-1
    ===================== */
    /* ==================
    article-8
    ===================== */
    /* ==================
      article-10
      ===================== */
    /* ==================
      article-12
      ===================== */
    /* article-12 */
    /* ==================
      article-16
      ===================== */
    /* ==================
      article-19
      ===================== */
    /* ==================
    article-22
    ===================== */
    /* ==================
    article-24
    ===================== */
    /* ==================
    article-25
    ===================== */
    /* ==================
    article-29
    ===================== */
    /* ==================
    article-30
    ===================== */
    /* ==================
    article-31
    ===================== */
  }
  .wrapper.article .hdArea {
    /* titleArea */
  }
  .wrapper.article .hdArea h1 {
    left: calc(50% - 490px);
  }
  .wrapper.article .hdArea .titleArea h2 span.tag {
    left: calc(100% - 478px);
  }
  .wrapper.article .hdArea .titleArea h2 span.ttl > span {
    margin-left: calc(100% - 478px);
    font-size: 32px;
  }
  .wrapper.article .hdArea .titleArea h2 span.ttl .small {
    font-size: 18px;
  }
  .wrapper.article .hdArea.sample .titleArea h2 span.ttl > span {
    margin-left: calc(100% - 512px);
    font-size: 33px;
  }
  .wrapper.article .hdArea.sample .titleArea h2 span.ttl > span.s31 {
    font-size: 31px;
  }
  .wrapper.article-1 .hdArea .titleArea h2 span.tag {
    left: calc(100% - 504px);
  }
  .wrapper.article-1 .hdArea .titleArea h2 span.ttl > span {
    margin-left: calc(100% - 504px);
  }
  .wrapper.article-8 .hdArea .titleArea h2 span.tag {
    left: calc(100% - 538px);
  }
  .wrapper.article-8 .hdArea .titleArea h2 span.ttl > span {
    margin-left: calc(100% - 538px);
  }
  .wrapper.article-10 {
    /* hdArea */
  }
  .wrapper.article-10 .hdArea .titleArea h2 span.ttl > span {
    font-size: 29px;
  }
  .wrapper.article-12 {
    /* hdArea */
  }
  .wrapper.article-12 .hdArea {
    /* titleArea */
  }
  .wrapper.article-12 .hdArea h1 {
    left: calc(50% - 490px);
  }
  .wrapper.article-12 .hdArea .titleArea h2 span.tag {
    left: calc(100% - 478px);
  }
  .wrapper.article-12 .hdArea .titleArea h2 span.ttl > span {
    margin-left: calc(100% - 478px);
  }
  .wrapper.article-16 .hdArea .titleArea h2 span.tag {
    left: calc(100% - 488px);
  }
  .wrapper.article-16 .hdArea .titleArea h2 span.ttl > span {
    margin-left: calc(100% - 488px);
    font-size: 31px;
  }
  .wrapper.article-19 .hdArea .titleArea h2 span.ttl > span {
    font-size: 30px !important;
  }
  .wrapper.article-19.p2 .hdArea .titleArea h2 span.ttl > span {
    font-size: 25px !important;
  }
  .wrapper.article-22 .hdArea .titleArea h2 span.ttl > span {
    font-size: 29px;
  }
  .wrapper.article-24 .hdArea .titleArea h2 span.ttl > span {
    font-size: 29px;
  }
  .wrapper.article-24.p2 .hdArea .titleArea h2 span.ttl > span {
    font-size: 27px;
  }
  .wrapper.article-25 .hdArea .titleArea h2 span.ttl > span {
    font-size: 31px;
  }
  .wrapper.article-29 .hdArea.sample .titleArea h2 span.ttl > span {
    font-size: 32px;
  }
  .wrapper.article-30 .hdArea.sample .titleArea h2 span.ttl > span {
    font-size: 30px;
  }
  .wrapper.article-30.p2 h2 span.ttl > span strong {
    font-size: 26px;
  }
  .wrapper.article-31 .hdArea.sample .titleArea h2 span.ttl > span {
    font-size: 30px;
  }
  /* wrapper */
} /* min-width: 1100px */
@media screen and (min-width: 1170px) {
  .wrapper {
    /* article */
  }
  .wrapper.article .bannerArea.bannerArea2 {
    width: auto;
  }
  .wrapper.article .bannerArea.bannerArea2 li {
    min-height: 38px;
  }
  .wrapper.article .bannerArea.bannerArea2 li a {
    padding-right: 18px;
  }
  .wrapper.article .bannerArea.bannerArea2 li a span {
    position: absolute;
    right: 4px;
    top: 8px;
  }
  .wrapper.article .bannerArea.bannerArea2 li a br {
    display: none;
  }
} /* min-width: 1170px */
@media screen and (min-width: 1200px) {
  .wrapper.indexPage .contentArea .themaArea {
    left: calc(50% + 30px);
  }
  .wrapper.indexPage .contentArea .articleList li {
    width: 30% !important;
  }
  .wrapper .navListBox nav {
    width: 40%;
    max-width: 440px;
  }
  .wrapper .navListBox .navBar .hamburger {
    position: fixed;
    top: 82px;
    right: 30px;
    margin: 0 auto;
    padding: 16px 2px;
    width: 45px;
    height: 45px;
    background-color: #000;
  }
  .wrapper .navListBox .navBar .hamburger span {
    width: 20px;
  }
  .wrapper .navListBox .navBar .linkList {
    top: 12px;
    left: calc(50% - 540px);
  }
} /* min-width: 1200px */
@media screen and (min-width: 1300px) {
  .wrapper {
    /* ==================
    article-4
    ===================== */
    /* ==================
    article-3
    ===================== */
  }
  .wrapper.article-4 {
    /* p2 */
  }
  .wrapper.article-4.p2 {
    /* titleArea */
  }
  .wrapper.article-4.p2 .titleArea h2 span {
    /* ttl */
  }
  .wrapper.article-4.p2 .titleArea h2 span.ttl {
    width: 90%;
  }
  .wrapper.article-4.p2 .titleArea h2 span.ttl > span {
    margin-left: calc(90% - 344px);
  }
  .wrapper.article-3 {
    /* p2 */
  }
  .wrapper.article-3.p2 {
    /* titleArea */
  }
  .wrapper.article-3.p2 .titleArea h2 span {
    /* ttl */
  }
  .wrapper.article-3.p2 .titleArea h2 span.ttl {
    width: 90%;
  }
  .wrapper.article-3.p2 .titleArea h2 span.ttl > span {
    margin-left: calc(90% - 344px);
  }
  /* wrapper */
} /* min-width: 1300px */
@media screen and (min-width: 1500px) {
  .wrapper.indexPage {
    /* contentArea */
  }
  .wrapper.indexPage .contentArea .themaArea {
    left: calc(50% + 190px);
  }
  .wrapper.indexPage .contentArea .inner {
    width: 1400px;
  }
  .wrapper.indexPage .contentArea .articleList a {
    margin: 0 auto;
  }
  /* wrapper */
} /* min-width: 1300px */