@charset "UTF-8";
/* scss/common.scss */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
@import url(https://fonts.googleapis.com/css?family=Lato:300,400|Questrial);
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

@font-face {
  font-family: "Times";
  src: url("/assets/fonts/Times.ttf") format("ttf");
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

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

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

*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }

.clearfix:after {
  clear: both;
  content: "";
  display: block; }

@media (min-width: 641px) {
  .fl {
    float: left; } }

@media (min-width: 641px) {
  .fr {
    float: right; } }

.clearfix:after {
  clear: both;
  content: "";
  display: block; }

@media (min-width: 641px) {
  .fl {
    float: left; } }

@media (min-width: 641px) {
  .fr {
    float: right; } }

html {
  font-size: 55.5%;
  width: 100%;
  height: initial; }
  @media (min-width: 641px) {
    html {
      font-size: 62.5%; } }

body {
  width: 100%;
  min-width: 100%;
  margin: 0;
  padding: 0;
  background: #F5F5F5;
  color: #444444;
  font-family: 'Yu Mincho', YuMincho, Noto Sans, "HGP明朝B", serif;
  font-size: 1.3rem;
  line-height: 2.0;
  font-weight: 100; }
  @media (max-width: 640px) {
    body {
    font-size: 1.6rem;
      -webkit-text-size-adjust: 100%; } }

@media (max-width: 640px) {
  .pc {
    display: none; } }

@media (min-width: 641px) {
  .sp {
    display: none; } }

img {
  height: auto;
  vertical-align: bottom;
  width: 100%; }
  @media (max-width: 640px) {
    img {
      width: 100%;
      max-width: 100%; } }

a {
  text-decoration: none;
  color: #000; }

main {
  position: relative;
  z-index: 1;
  margin: 0 0 0; }
  @media (min-width: 641px) {
    main {
      margin: 0 0 0;
      position: relative;
      top: 0; } }
  main a {
    transition: .1s; }
    main a:hover {
      opacity: .6; }
  main b {
    font-weight: bold; }

.sec {
  zoom: 1;
  padding: 80px 0;
  box-sizing: border-box; }
  .sec:after {
    clear: both;
    content: "";
    display: block; }

.sec-wrap {
  zoom: 1; }
  .sec-wrap:after {
    clear: both;
    content: "";
    display: block; }
  @media (max-width: 640px) {
    .sec-wrap {
      padding: 0 20px; } }
  @media (min-width: 641px) {
    .sec-wrap {
      width: 1280px;
      margin: 0 auto; } }

#header {
  zoom: 1;
  font-feature-settings: "palt";
  position: fixed;
  z-index: 999;
  width: 100%; }
  #header:after {
    clear: both;
    content: "";
    display: block; }

.pc-header {
  color: #000000;
  position: relative;
  width: 100%;
  height: 100px; }
  .pc-header a {
    color: #000000;
    transition: .3s; }
    .pc-header a:hover {
      opacity: .6; }

footer {
  position: relative; }

#header {
  /* nav */
  /* Fixed reset */ }
  #header .smp-logo {
    width: 14%;
    max-width: 200px;
    margin: 0;
    position: relative;
    z-index: 9999;
    padding-left: 4%;
    top: 5px; }
  #header .sp-header {
    position: relative; }
  #header .sp-header .inner {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    margin: auto;
    z-index: 999; }
  #header .sp-header.fixed {
    margin-top: 0;
    top: 0;
    position: fixed;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.9);
    z-index: 9999; }
  #header #nav-toggle {
    display: none;
    position: absolute;
    right: 40px;
    top: 40px;
    width: 50px;
    height: 20px;
    cursor: pointer; }
  #header #nav-toggle div {
    position: relative; }
  #header #nav-toggle span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background:  #3D3D3D;
    left: 0;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out; }
  #header #nav-toggle span:nth-child(1) {
    top: 0; }
  #header #nav-toggle span:nth-child(2) {
    top: 18px; }
  #header #nav-toggle span:nth-child(3) {
    top: 36px; }
  #header .sp-header, #header .inner {
    width: 100%;
    padding: 0; }
  #header .sp-header {
    top: 0;
    position: fixed;
    margin-top: 0; }
  #header .sp-header.fixed {
    padding-top: 0;
    background: transparent; }
  #header #mobile-head {
    width: 100%;
    z-index: 9999;
    height: 55px;
    position: relative; }
  #header #global-nav {
    margin-top: -58px;
    position: absolute;
    top: -701px;
    background-color: rgba(255, 255, 255, 0.8);
    width: 100%;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    width: 100%;
    height: 90px; }
  #header #nav-toggle {
    display: block; }
  #header .open #nav-toggle span:nth-child(1) {
    top: 11px;
    -webkit-transform: rotate(315deg);
    -moz-transform: rotate(315deg);
    transform: rotate(315deg); }
  #header .open #nav-toggle span:nth-child(2) {
    width: 0;
    left: 50%; }
  #header .open #nav-toggle span:nth-child(3) {
    top: 11px;
    -webkit-transform: rotate(-315deg);
    -moz-transform: rotate(-315deg);
    transform: rotate(-315deg); }
  #header .open #global-nav {
    -moz-transform: translateY(755px);
    -webkit-transform: translateY(755px);
    transform: translateY(755px);
    z-index: 200;
    padding-bottom: 80px; }
  #header nav {
    width: 100%;
    margin: 0 auto; }
  #header .open nav {
    display: block;
    text-align: center; }
  #header nav ul {
    width: 100%;
    z-index: 2000;
    display: inline-block;
    padding-top: 50px; }
  #header nav ul li {
    display: inline-block;
    margin: 0 20px;
    font-family: 'Arial', serif; }
  #header nav ul li a {
    display: block;
    font-size: 1.4rem;
    font-weight: bold;
    width: 100%;
    letter-spacing: 1px; }
    #header nav ul li a span {
      display: inline-block; }
  #header .sns {
    margin-left: -30px; }
    #header .sns a {
      display: inline-block;
      text-align: left;
      width: inherit; }
    #header .sns img {
      width: 22px;
      margin-left: 0; }
    #header .sns:last-child img {
      margin-left: 30px; }





.simple_square_btn2 {
    margin:0 auto;
    margin-top:30pt;
	display: block;
	position: relative;
    min-width: 100pt;
	width: 50%;
	padding: 0.9em;
    font-size: 1.3rem;
	text-align: center;
	text-decoration: none;
	color: #fff;
	background-color:#262626;
	border:0px solid #fff;
}





@media (max-width: 640px) {
  #header {
    /* nav */
    /* Fixed reset */ }
    #header .smp-logo {
      width: 14%;
      max-width: 200px;
      margin: 0;
      position: relative;
      z-index: 9999;
      padding-left: 4%;
      top: 5px; }
    #header .sp-header {
      position: relative; }
    #header .sp-header .inner {
      position: absolute;
      top: 0;
      right: 0;
      z-index: 999; }
    #header .sp-header.fixed {
      margin-top: 0;
      top: 0;
      position: fixed;
      width: 100%;
      background-color: rgba(255, 255, 255, 0.9);
      z-index: 9999; }
    #header #nav-toggle {
      display: none;
      position: absolute;
      right: 17px;
      top: 19px;
      width: 23px;
      height: 25px;
      cursor: pointer; }
    #header #nav-toggle div {
      position: relative; }
    #header #nav-toggle span {
      display: block;
      position: absolute;
      height: 2px;
      width: 100%;
      background: #d4d4d6;
      left: 0;
      -webkit-transition: .35s ease-in-out;
      -moz-transition: .35s ease-in-out;
      transition: .35s ease-in-out; }
    #header #nav-toggle span:nth-child(1) {
      top: 0; }
    #header #nav-toggle span:nth-child(2) {
      top: 8px; }
    #header #nav-toggle span:nth-child(3) {
      top: 16px; }
    #header .sp-header, #header .inner {
      width: 100%;
      padding: 0; }
    #header .sp-header.open, #header .open .inner {
      height: 100%; }
    #header .sp-header {
      top: 0;
      position: fixed;
      margin-top: 0; }
    #header .sp-header.fixed {
      padding-top: 0;
      background: transparent; }
    #header #mobile-head {
      width: 100%;
      z-index: 9999;
      height: 55px;
      position: relative; }
    #header #global-nav {
      position: absolute;
      top: -701px;
      background-color: rgba(FD0000);
      width: 100%;
      -webkit-transition: .5s ease-in-out;
      -moz-transition: .5s ease-in-out;
      transition: .5s ease-in-out;
      width: 100%;
      height: 100%;
      overflow-y: scroll;
      -webkit-overflow-scrolling: touch; }
    #header #nav-toggle {
      display: block; }
    #header .open #nav-toggle span:nth-child(1) {
      top: 11px;
      -webkit-transform: rotate(315deg);
      -moz-transform: rotate(315deg);
      transform: rotate(315deg);
      background: #000; }
    #header .open #nav-toggle span:nth-child(2) {
      width: 0;
      left: 50%; }
    #header .open #nav-toggle span:nth-child(3) {
      top: 11px;
      -webkit-transform: rotate(-315deg);
      -moz-transform: rotate(-315deg);
      transform: rotate(-315deg);
      background: #000; }
    #header .open #global-nav {
      -moz-transform: translateY(755px);
      -webkit-transform: translateY(755px);
      transform: translateY(755px);
      z-index: 200;
      padding-bottom: 80px; }
    #header nav {
      width: 100%;
      margin: 0 auto;
      padding: 20px 15px; }
    #header .open nav {
      display: block; }
    #header nav ul {
      width: 100%;
      z-index: 2000; }
    #header nav ul li {
      text-align: left;
      padding: 1em 0;
      margin: 0;
      display: block; }
    #header nav ul li a {
      display: block;
      font-size: 1.6rem;
      width: 100%;
      font-weight: 400; }
      #header nav ul li a span {
        display: inline-block;
        margin-left: 1em; }

  #header .sns {
    margin: 0 !important;
    text-align: center; }

  #header .sns:last-child img {
    width: 30px;
    margin: 0 10px; } }






Result Skip Results Iframe
EDIT ON
.zoom-1 img {
      width: 100%;
      height: auto;
      animation: animationZoom1 1s ease-in-out forwards;
    }
.zoom-2 img {
      width: 100%;
      height: auto;
      animation: animationZoom2 2s ease-in-out infinite;
    }





#kvArea {
    letter-spacing: 1px;
  width: 100%;
  position: relative; }
  #kvArea #logo {
    width: 120px;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 60px;
    position: absolute;
    z-index: 500; }
  #kvArea ul li img {
    width: 100%; }
  #kvArea #kvTxt {
    position: absolute;
    z-index: 100;
    width: 60%;
    margin: 0 auto;
    color: #fff;
    text-align: center;
    top: 40%;
    left: 0;
    right: 0; }
    #kvArea #kvTxt h1 {
      font-size: 30px;
      letter-spacing: 20px;
      font-family: 'Arial', serif;
      margin-bottom: 1em; }
    #kvArea #kvTxt .copy01 {
        font-family:serif;
        font-size:2em;
        margin-top:30px;
      margin-bottom: 0.1em;
      letter-spacing: 3px;}
    #kvArea #kvTxt .copy02 {
        font-size:1em;
        margin-top:-10px;
      margin-bottom: 1em; }
    #kvArea #kvTxt .copy03 {
      font-size: 1.2rem; }

#kvArea #catch01 {
    width: 400px;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 280px;
    position: absolute;
    z-index: 500; }

main {letter-spacing: 1px;
  background-color: #fff;/* 背景色 */
  position: relative;
  text-align: center; }
  main h2 {
    font-family: rebuchet;
    font-size: 18px;
    margin-bottom: 1em; }



p.caption{/*BODYテキスト全部の幅*/
    margin: 4% 15%;
}

  main .en {
    font-size: 12px;
margin: 4% 20%;}/*英字テキストの幅*/
  main .en2 {
    font-size: 12px;
margin: 20px 0px;}/*個別アイテム欄の英字テキストの幅*/
  main .date {
    font-size: 8px;
      text-align: center;
margin: -3px -4px;}
  main p {
    margin-bottom: 3em; }
  main section {
    padding: 8vw 0;
    margin: -3vw 5% 0;
    border-bottom: 1px solid #000; }

  main #content02 {
  max-width: 1100px;
  margin:0 auto; }


  main #content02 h3 {
    font-size: 20px;
    margin-top: 1em;
    margin-bottom: -1em; }

  main #content02 h4 {
    font-size: 20px;
    margin-bottom: 1em; }

  main #content02 ul {
    width: 100%;
    zoom: 1;
    font-size: 0; }

    main #content02 ul:after {
      clear: both;
      content: "";
      display: block; }

    main #content02 ul li {
      line-height: 0;
      width: 33.3333%;
      float: left;
      overflow: hidden;
      background-color: #000;
      position: relative; }

      main #content02 ul li a {
        display: block;
        height: 100%;
        opacity: 1; }

        main #content02 ul li p {
          font-family: 'ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
          letter-spacing: 1px;
          font-weight: normal;
          position: absolute;
          font-size: 14px;
          top: 50%;
          left: 0;
          right: 0;
          bottom: 0;
          margin: auto;
          color: #fff;
          opacity: 1; }
        main #content02 ul li a:hover img {
          opacity: 0.6; }
      main #content02 ul li img {
        vertical-align: bottom;
        display: block; }

.imgWrap {
	overflow: hidden;	/*拡大時にはみ出た部分を隠す*/
	width: 100%;	/*画像の幅*/
	height: 100%;	/*画像の高さ*/
    background: transparent;
    margin: auto;
}
.imgWrap img {
	display: block;
	transition-duration: 0.3s;	/*変化に掛かる時間*/
}
.imgWrap img:hover {
	transform: scale(1.1);	/*画像の拡大率*/
	transition-duration: 0.8s;	/*変化に掛かる時間*/
    opacity: 0.6;
}
    

main #content03 {
  max-width: 1100px;
  margin:0 auto; }

  main #content03 ul {
    width: 100%;
    zoom: 1; }
    main #content03 ul:after {
      clear: both;
      content: "";
      display: block; }
    main #content03 ul li {
      line-height: 0;
      width: 49.8%;
      float: left; }
      main #content03 ul li:nth-child(2), main #content03 ul li:nth-child(4) {
        float: right; }
      main #content03 ul li p {
        line-height: 1.4em;
        font-size: 1.3rem;
        width: 100%;
        margin: 1vw auto 20px; }











/*SP*/
@media (max-width: 640px) {
  #kvArea {
    width: 100vw;
    height: 80vh;
    position: fixed; }
    #kvArea #logo {
      width: 20%;
      top: 30px; }
    #kvArea ul li img {
        animation: zoomUp 7s linear 0s normal both;
      width: 100%; }
    #kvArea #kvTxt {
      width: 80%;
      padding: 0 3%;
      top: 30%; }
      #kvArea #kvTxt h1 {
        font-size: 1.8rem;
        margin-bottom: 0.5em; }
      #kvArea #kvTxt .copy01 {
        font-size: 4rem;
        margin-top:100px;
        margin-bottom: 0.5em;
        letter-spacing: 2px;
      font-size: 1.8rem; }
      #kvArea #kvTxt .copy02 {
        font-size: 1.4rem;
         margin: 10px 0px;}
      #kvArea #kvTxt .copy03 {
        font-size: 1.2rem; 
          margin: 10px 0px;}
    #kvArea .swiper-button-prev, #kvArea .swiper-button-next {
      background-size: 50%; }

  main {
    top: 800px; }
    main h2 {
      font-size: 2.4rem;
      margin-bottom: 1em; }
    
    p.caption{
    margin: 30px 0px;}

    main .en {
      font-size: 1.5rem;
    margin: 20px 0px;}
    
    main p {
      margin-bottom: 3em;
      text-align: justify;
      text-justify: inter-ideograph; }
    main section {
      padding: 12vw 0 8vw;
      margin: 0vw 10% 0;
      border-bottom: 1px solid #000; }/*SECTIONごとの仕切りのライン色：SP*/

      main #content02 {
        max-width:90%; }

    main #content02 h3 {
      font-size: 2.4rem;
      margin-top: 0.5em;
      margin-bottom: -1em; }
    main #content02 h4 {
      font-size: 2.0rem;
      margin-bottom: 1em; }
    main #content02 ul li {
      line-height: 0;
      width: 100%;
      float: none; }
      main #content02 ul li a {
        display: block;
        height: 100%;
        opacity: 1; }
        main #content02 ul li a:hover img {
          opacity: 1; }
      main #content02 ul li img {
        vertical-align: bottom;
        display: block; }

        main #content03 {
          max-width:90%; }

    main #content03 ul {
      width: 100%;
      zoom: 1; }
      main #content03 ul:after {
        clear: both;
        content: "";
        display: block; }
      main #content03 ul li {
        line-height: 0;
        width: 50%;
        float: left; }
        main #content03 ul li:nth-child(2), main #content03 ul li:nth-child(4) {
          float: right; }
        main #content03 ul li p {
          display: none; } 
    
        main #content02 ul li p {
        text-align: center;
        left: 20%;
        right:20%;}
}








/*PC*/
@media screen and (max-width: 200px) {
#animation {
margin: 50px 0;
font-size: 40px;
font-weight: bold;
color: #ff0000;
}

.fadeInDown {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInDown;
 animation-name: fadeInDown;
 visibility: visible !important;
}
@-webkit-keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
    
  #kvArea #kvTxt h1 {
    font-size: 1.6rem;
    margin-bottom: 0.5em; }
  #kvArea #kvTxt .copy02 {
    font-size: 1.2rem;
    margin-bottom: 1em; }
  #kvArea #kvTxt .copy03 {
    font-size: 1.2rem; } }
#subContent {
    max-width:1100px;
  zoom: 1;
  padding: 10vw 0 4vw;
  margin: 0 auto;
  border-bottom: none; }
  #subContent:after {
    clear: both;
    content: "";
    display: block; }
  #subContent h2 {
    margin-bottom: 0; }
  #subContent h3 {
    margin-bottom: 2em; }
  #subContent p {
    margin-bottom: 2em; }
  #subContent ul {
    float: left;
    width: 100%; }
    #subContent ul li {
      width: 49.5%;
      display: inline-block;
      margin-bottom: 5px; }

  #subContent .detail {
    width: 100%;
    text-align: left;
    padding: 0 2%;
margin-bottom: 0%;}

#subContent .detail4 {
  width: 100%;
  text-align: left;
  padding: 0 2%;
margin-top: 108%;
margin-bottom: 0%;}

#subContent .detail6 {
  width: 100%;
  text-align: left;
  padding: 0 2%;
margin-top: 155%;
margin-bottom: 0%;}

#subContent .detail8 {
  width: 100%;
  text-align: left;
  padding: 0 2%;
margin-top: 205%;
margin-bottom: 0%;}

    #subContent .detail ul {
      float: none;
      width: 100%;
      margin-bottom: 2em; }
      #subContent .detail ul li {
        display: block;
        width: 100%;
        margin-bottom: 0; }
    #subContent .detail .btn a {
      background-color: #000;
      color: #fff;
      display: block;
      width: 50%;
      text-align: center;
      padding: 2% 0;
      margin-top: 40px; }
  main .date {
    font-size: 12px;
      text-align: center;
margin: -00px 0px;}



 



@media (max-width: 640px) {
  .subMain {
    top: 0;
  padding-bottom:50px; }

  #subContent {
    zoom: 1;
    padding: 10vw 0 4vw;
    margin: 0 5% 0;
    border-bottom: none; }
    #subContent:after {
      clear: both;
      content: "";
      display: block; }
    #subContent h2 {
      margin-bottom: 0; }
    #subContent h3 {
      margin-bottom: 2em; }
    #subContent p {
      margin-bottom: 2em; }
    #subContent .imgList {
      float: none;
      width: 100%;
      letter-spacing: -.4em; }
      #subContent .imgList li {
        width: 100%;
        display: block;
        margin-bottom: 0px;
        vertical-align: bottom; }
        #subContent .imgList li img {
          vertical-align: bottom; }
        #subContent .imgList li:nth-child(n+3):nth-child(even) {
          margin-top: 1px;
          width: 100%;
          letter-spacing: normal;
          display: inline-block;
          margin-left: 0.4%; }
        #subContent .imgList li:nth-child(n+3):nth-child(odd) {
          margin-top: 1px;
          width: 100%;
          letter-spacing: normal;
          display: inline-block; }
    #subContent .detail {
      float: none;
      width: 100%;
      text-align: left;
      padding: 3em 0 0 0;
margin-top: 0%;}

#subContent .detail4 {
  float: none;
  padding: 3em 0 0 0;
margin-top: 0%;}

#subContent .detail6 {
  float: none;
  padding: 3em 0 0 0;
margin-top: 0%;}

#subContent .detail8 {
  float: none;
  padding: 3em 0 0 0;
margin-top: 0%;}


      #subContent .detail ul {
        float: none;
        width: 100%;
        margin-bottom: 2em; }
        #subContent .detail ul li {
          display: block;
          width: 100%;
          margin-bottom: 0; }
      #subContent .detail .btn a {
        margin-bottom: 3em;
        font-size: 2rem; } 
}




.lookforward {
  z-index: 800 !important; }

.lookforward-close-btn {
  z-index: 9999 !important;
  top: 40px !important; }

.lookforward-close-btn._pattern1 {
  background-image: url(../images/img_arrow.png) !important; }

.lookforward header #nav-toggle {
  right: 35px !important;
  z-index: 100000; }








@media (max-width: 640px) {
  .lookforward-close-btn {
    width: 32px !important;
    height: 32px !important;
    top: 15px !important; }

  .lookforward header #nav-toggle {
    right: 17px !important; } }









footer {
  width: 100%;
  position: relative;
  text-align: center;
  margin: 0 auto;
  padding: 3vw 0;
  background-color: #fff;}
  footer h2 {
    font-family: 'Arial', serif;
    font-size: 18px;
    margin-bottom: 0em; }
  footer p:nth-child(3) {
    font-size: 1.2rem; }
  footer p:nth-child(4) {
    letter-spacing: 1.5px; }
  footer p:nth-child(5) {
    width: 300px;
    margin: 2em auto; }
  footer #logo_footer {
    width: 100px;
    margin: 2em auto 3em; }
  footer h5 {
    font-family: 'Arial', serif;
    font-size: 10px;
    margin-bottom: 1em; }

.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
margin-top:0pt;
margin-bottom:10pt;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 20;
left: 0;
width: 100%;
height: 100%;
}

iframe{
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
}






/* SP */
@media (max-width: 640px) {
  footer {
    width: 100%;
    position: relative;
    top: 800px;
    text-align: center;
    padding: 7vw 5%;
    margin: 0;
    background-color: #fff;}
    footer h2 {
      font-size: 2.4rem;
      margin-bottom: 0em; }
    footer p:nth-child(3) {
      font-size: 1.2rem; }
    footer p:nth-child(4) {
      letter-spacing: 1.5px; }
    footer p:nth-child(5) {
      width: 80%;
      margin: 2em auto; }
    footer #logo_footer {
      width: 20%;
      margin: 2em auto 3em; } 
footer p2 {
      font-family: 'Arial', serif;
      font-size: 1rem;
      margin-bottom: 1em; }

footer h5 {
      font-size: 1.0rem;
      margin-bottom: 1em; }
    
footer a {
      font-family: 'Arial', serif;
      font-size: 1.5rem;
      margin-bottom: 1em; }
    
.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 250px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
    margin-top:20pt;
}

iframe{
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
}
}