@charset "UTF-8";
/* RESET */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0; }

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

fieldset, img {
  border: 0; }

address, caption, cite, code, dfn, em, strong, th, var, optgroup {
  font-style: inherit;
  font-weight: inherit; }

del, ins {
  text-decoration: none; }

li {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

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

abbr, acronym {
  border: 0;
  font-variant: normal; }

sup {
  vertical-align: baseline; }

sub {
  vertical-align: baseline; }

legend {
  color: #000; }

input, button, textarea, select, optgroup, option {
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit; }

input, button, textarea, select {
  *font-size: 100%; }

/* RESET HTML5 */
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%;
  font: inherit;
  vertical-align: baseline; }

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

/* GENERAL */
a:link, a:visited {
  color: #000;
  text-decoration: none; }

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

a {
  outline: none; }

/* CLEARFIX */
.clearfix {
  zoom: 1; }

.clearfix:after,
.c2:after,
.c3:after,
.aaaaaaaaaa:after,
.aaaaaaaaaa:after,
.aaaaaaaaaa:after,
.aaaaaaaaaa:after,
.aaaaaaaaaa:after,
.aaaaaaaaaa:after,
.aaaaaaaaaa:after,
.aaaaaaaaaa:after,
.aaaaaaaaaa:after {
  content: ".";
  display: block;
  visibility: hidden;
  clear: both;
  height: 0;
  font-size: 0;
  line-height: 0; }

strong {
  font-weight: bold; }

img {
  vertical-align: bottom; }

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button;
  border: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  border-radius: 0; }

input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
  border-radius: 0; }

input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
  border-radius: 0; }

body.hidden {
  overflow: hidden; }

html.hidden {
  overflow: hidden; }

body.mfp-active {
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  position: fixed;
  overflow: auto; }

body .mfp-wrap {
  position: fixed;
  overflow: auto;
  top: 0 !important; }

.mfp-bg {
  background-color: #fff;
  -webkit-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out; }

/* overlay at start */
.mfp-fade.mfp-bg {
  opacity: 0; }

/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.98; }

/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0; }

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;
  -webkit-transition: all 0.6s ease-out;
  -o-transition: all 0.6s ease-out;
  transition: all 0.6s ease-out;
  -webkit-transition-delay: 0.3s;
  -o-transition-delay: 0.3s;
  transition-delay: 0.3s; }

/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1; }

/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0; }

body {
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: none;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  background-color: #fff;
  color: #000;
  position: relative;
  line-height: 160%;
  font-weight: 400;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  font-size: 12px; }

#frenchTrad2020 {
  /* ------------------------------------------
ipad
------------------------------------------ */
  /* ------------------------------------------
smartphone
------------------------------------------ */ }
  #frenchTrad2020 .onlyPc {
    display: block; }
  #frenchTrad2020 .onlySp {
    display: none; }
  #frenchTrad2020 .sec {
    position: relative;
    overflow: hidden;
    -webkit-transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
    opacity: 0; }
    #frenchTrad2020 .sec.active {
      opacity: 1; }
  #frenchTrad2020 .topSlider img {
    pointer-events: none; }
  #frenchTrad2020 header {
    text-align: center;
    height: 100%;
    height: 100vh;
    width: 100%;
    overflow: hidden;
    z-index: 100;
    position: relative; }
    #frenchTrad2020 header#pcHeader {
      position: fixed;
      z-index: 100;
      background-color: #fff; }
    #frenchTrad2020 header #clickMask {
      height: 100%;
      height: 100vh;
      width: 100%;
      cursor: pointer;
      position: relative;
      z-index: 50; }
    #frenchTrad2020 header .headerBox {
      position: absolute;
      left: 50%;
      top: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      z-index: 5; }
    #frenchTrad2020 header #logo img {
      max-width: 100%; }
    #frenchTrad2020 header #theme img {
      max-width: 100%; }
    #frenchTrad2020 header .bg {
      height: 100vh;
      width: 100%;
      background-image: url("../images/img_visual.jpg");
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center center; }
    #frenchTrad2020 header .bgAll {
      height: 100vh;
      width: 100%; }
      #frenchTrad2020 header .bgAll .thum {
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
        -webkit-transition: opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        -o-transition: opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        transition: opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
        #frenchTrad2020 header .bgAll .thum.anim {
          opacity: 1; }
        #frenchTrad2020 header .bgAll .thum img {
          width: 100%; }
      #frenchTrad2020 header .bgAll #thum01 {
        width: 10.33%;
        left: -1.0%;
        top: 11.25%;
        -webkit-transition-delay: 0.25s;
        -o-transition-delay: 0.25s;
        transition-delay: 0.25s; }
      #frenchTrad2020 header .bgAll #thum02 {
        width: 14.00%;
        left: 19.0%;
        top: 1.625%;
        -webkit-transition-delay: 0.5s;
        -o-transition-delay: 0.5s;
        transition-delay: 0.5s; }
      #frenchTrad2020 header .bgAll #thum03 {
        width: 14.50%;
        left: 36.25%;
        top: 6.125%;
        -webkit-transition-delay: 1s;
        -o-transition-delay: 1s;
        transition-delay: 1s; }
      #frenchTrad2020 header .bgAll #thum04 {
        width: 14.50%;
        left: 61.33%;
        top: 12.625%;
        -webkit-transition-delay: 1s;
        -o-transition-delay: 1s;
        transition-delay: 1s; }
      #frenchTrad2020 header .bgAll #thum05 {
        width: 6.33%;
        left: 72.16%;
        top: 3.00%;
        -webkit-transition-delay: 1.25s;
        -o-transition-delay: 1.25s;
        transition-delay: 1.25s; }
      #frenchTrad2020 header .bgAll #thum06 {
        width: 14.50%;
        left: 81.08%;
        top: 10.125%;
        -webkit-transition-delay: 1.5s;
        -o-transition-delay: 1.5s;
        transition-delay: 1.5s; }
      #frenchTrad2020 header .bgAll #thum07 {
        width: 20.83%;
        left: 11.45%;
        top: 25.50%;
        -webkit-transition-delay: 1.75s;
        -o-transition-delay: 1.75s;
        transition-delay: 1.75s; }
      #frenchTrad2020 header .bgAll #thum08 {
        width: 7.916%;
        left: 72.16%;
        top: 47.5%;
        -webkit-transition-delay: 2s;
        -o-transition-delay: 2s;
        transition-delay: 2s; }
      #frenchTrad2020 header .bgAll #thum09 {
        width: 15.33%;
        left: 87.66%;
        top: 33.75%;
        -webkit-transition-delay: 2.25s;
        -o-transition-delay: 2.25s;
        transition-delay: 2.25s; }
      #frenchTrad2020 header .bgAll #thum10 {
        width: 7.91%;
        left: 5.58%;
        top: 61.00%;
        -webkit-transition-delay: 2.5s;
        -o-transition-delay: 2.5s;
        transition-delay: 2.5s; }
      #frenchTrad2020 header .bgAll #thum11 {
        width: 9.25%;
        left: 20.16%;
        top: 74.62%;
        -webkit-transition-delay: 2.75s;
        -o-transition-delay: 2.75s;
        transition-delay: 2.75s; }
      #frenchTrad2020 header .bgAll #thum12 {
        width: 12.83%;
        left: 3%;
        top: 83.37%;
        -webkit-transition-delay: 3s;
        -o-transition-delay: 3s;
        transition-delay: 3s; }
      #frenchTrad2020 header .bgAll #thum13 {
        width: 15.33%;
        left: 34.66%;
        top: 66.75%;
        -webkit-transition-delay: 3.25s;
        -o-transition-delay: 3.25s;
        transition-delay: 3.25s; }
      #frenchTrad2020 header .bgAll #thum14 {
        width: 10.00%;
        left: 53.91%;
        top: 75.62%;
        -webkit-transition-delay: 3.5s;
        -o-transition-delay: 3.5s;
        transition-delay: 3.5s; }
      #frenchTrad2020 header .bgAll #thum15 {
        width: 31.75%;
        left: 68.25%;
        top: 73.25%;
        -webkit-transition-delay: 3.75s;
        -o-transition-delay: 3.75s;
        transition-delay: 3.75s; }
      #frenchTrad2020 header .bgAll #thum16 {
        width: 8.25%;
        left: 37.00%;
        top: 86.66%;
        -webkit-transition-delay: 4s;
        -o-transition-delay: 4s;
        transition-delay: 4s; }

@-webkit-keyframes fuwafuwa {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px); }
  50% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px); }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px); } }

@keyframes fuwafuwa {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px); }
  50% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px); }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px); } }
  #frenchTrad2020 .border {
    border: 2px solid #000; }
  #frenchTrad2020 .scrollBtn a {
    -webkit-transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1); }
    #frenchTrad2020 .scrollBtn a:hover {
      opacity: 0.6; }
  #frenchTrad2020 #logo {
    margin-bottom: 20px; }
  #frenchTrad2020 #theme {
    margin-bottom: 20px; }
  #frenchTrad2020 .concept {
    font-size: 10px;
    margin-bottom: 20px;
    font-family: 'acumin-pro', "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
    font-weight: 700; }
  #frenchTrad2020 .mainVisual {
    display: none;
    opacity: 0;
    -webkit-transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1); }
    #frenchTrad2020 .mainVisual.active {
      opacity: 1; }
    #frenchTrad2020 .mainVisual img {
      max-width: 100%; }
  #frenchTrad2020 video {
    max-width: 100%;
    width: 100%; }
  #frenchTrad2020 .wideImg .iframeBox {
    display: block;
    position: relative;
    overflow: hidden; }
  #frenchTrad2020 .wideImg .iframeBox:before {
    content: "";
    display: block;
    padding-top: 56.25%; }
  #frenchTrad2020 .wideImg .iframeBox iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%; }
  #frenchTrad2020 .contentBox {
    width: 1200px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 60px;
    padding-right: 60px;
    padding-bottom: 120px; }
  #frenchTrad2020 .contentBox2 {
    width: 800px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 60px;
    padding-right: 60px;
    padding-bottom: 100px; }
  #frenchTrad2020 .contentBox4 {
    width: 600px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 60px;
    padding-right: 60px;
    padding-bottom: 180px; }
  #frenchTrad2020 #sec1 {
    padding-top: 100px; }
  #frenchTrad2020 .logoBox {
    text-align: center; }
    #frenchTrad2020 .logoBox .concept {
      font-size: 12px; }
  #frenchTrad2020 .wideImg img {
    max-width: 100%; }
  #frenchTrad2020 .miniImg img {
    max-width: 100%; }
  #frenchTrad2020 .miniImg2 img {
    max-width: 100%; }
  #frenchTrad2020 .caption {
    padding-top: 15px;
    font-size: 11px;
    font-family: 'acumin-pro', "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
    font-weight: 700; }
  #frenchTrad2020 .mt {
    padding-top: 40px; }
  #frenchTrad2020 .c2 {
    margin-left: -10px;
    margin-right: -10px; }
    #frenchTrad2020 .c2 .box {
      float: left;
      width: 50%;
      width: calc(50% - 20px);
      margin: 0 10px; }
      #frenchTrad2020 .c2 .box .miniImg {
        padding-left: 0;
        padding-right: 0; }
      #frenchTrad2020 .c2 .box .miniImg2 {
        padding-left: 0;
        padding-right: 0; }
  #frenchTrad2020 .c3 {
    margin-left: -10px;
    margin-right: -10px; }
    #frenchTrad2020 .c3 .box {
      float: left;
      width: 33.33%;
      width: calc(33.33% - 20px);
      margin: 0 10px; }
      #frenchTrad2020 .c3 .box .miniImg {
        padding-left: 0;
        padding-right: 0; }
      #frenchTrad2020 .c3 .box .miniImg2 {
        padding-left: 0;
        padding-right: 0; }
  #frenchTrad2020 .redLogo {
    text-align: center;
    margin-bottom: 50px; }
    #frenchTrad2020 .redLogo img {
      max-width: 100%; }
  #frenchTrad2020 .credit {
    text-align: center;
    font-size: 10px;
    margin-bottom: 50px;
    font-family: 'acumin-pro', "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; }
  #frenchTrad2020 footer {
    text-align: center;
    font-size: 10px;
    padding-bottom: 10px;
    font-family: 'acumin-pro', "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; }
  #frenchTrad2020 .linkList {
    text-align: center; }
    #frenchTrad2020 .linkList li {
      display: inline-block;
      margin: 0 20px; }
      #frenchTrad2020 .linkList li a {
        text-align: left;
        background-size: 30px auto;
        background-repeat: no-repeat;
        background-position: center center;
        display: inline-block;
        text-indent: -9999px;
        width: 30px;
        height: 30px;
        -webkit-transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
        -o-transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
        transition: all 0.6s cubic-bezier(0.215, 0.61, 0.355, 1); }
        #frenchTrad2020 .linkList li a:hover {
          opacity: 0.6; }
      #frenchTrad2020 .linkList li a.instagram {
        background-image: url("../images/ico_instagram.png"); }
      #frenchTrad2020 .linkList li a.ec {
        background-image: url("../images/ico_ec.png"); }
      #frenchTrad2020 .linkList li a.hp {
        background-image: url("../images/ico_hp.png"); }
  @media screen and (max-width: 719px) {
    #frenchTrad2020 .onlyPc {
      display: none; }
    #frenchTrad2020 .onlySp {
      display: block; }
    #frenchTrad2020 body.hidden {
      overflow: visible !important; }
    #frenchTrad2020 html.hidden {
      overflow: visible !important; }
    #frenchTrad2020 .mainVisual {
      display: block;
      padding-left: 50px;
      padding-right: 50px;
      padding-top: 40px;
      margin-bottom: 20px; }
    #frenchTrad2020 .concept {
      margin-bottom: 60px; }
    #frenchTrad2020 header {
      background-image: none;
      height: auto;
      margin-bottom: 0px; }
      #frenchTrad2020 header .headerBox {
        position: relative;
        left: 0%;
        top: 0%;
        -webkit-transform: translate(0%, 0%);
        -ms-transform: translate(0%, 0%);
        transform: translate(0%, 0%); }
    #frenchTrad2020 .scrollBtn {
      display: none; }
    #frenchTrad2020 .bg {
      display: none; }
    #frenchTrad2020 .bgAll {
      display: none; }
    #frenchTrad2020 .contentBox {
      padding-left: 0;
      padding-right: 0;
      padding-bottom: 70px; }
    #frenchTrad2020 .caption {
      padding-left: 50px; }
    #frenchTrad2020 .miniImg {
      padding-left: 50px;
      padding-right: 50px; }
    #frenchTrad2020 .miniImg2 {
      padding-left: 70px;
      padding-right: 70px; } }

/* ------------------------------------------
smartphone
------------------------------------------ */
@media screen and (max-width: 719px) {
  body.hidden {
    overflow: visible !important; }
  html.hidden {
    overflow: visible !important; } }