/**/
/**/
/**/
/**/
/*gray*/
/*mediaquery*/
@import url("https://fonts.googleapis.com/css?family=Crimson+Text|Marcellus");
/* -------------------------------- 
Primary style
-------------------------------- */
*, *::after, *::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

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

/*----------------------

creative cafe components

-----------------------*/
.creative_cafe .mv {
  background: url("../img/img_mvCreative_cafe.jpg") center center no-repeat;
  background-size: cover; }
.creative_cafe h3 {
  font-family: 'Marcellus', serif;
  font-weight: bolder;
  font-size: 32px;
  letter-spacing: 0.05em;
  text-align: center;
  margin-bottom: 30px; }
.creative_cafe .event h3 {
  color: #008bd5; }
.creative_cafe .event > div {
  display: flex;
  justify-content: space-between;
  width: 100%; }
  @media screen and (max-width: 768px) {
    .creative_cafe .event > div {
      flex-flow: column wrap; } }
  .creative_cafe .event > div .img_wrap {
    width: 30%; }
    .creative_cafe .event > div .img_wrap img {
      height: auto; }
    @media screen and (max-width: 768px) {
      .creative_cafe .event > div .img_wrap {
        width: 100%;
        margin: 0 0 20px 0; } }
    .creative_cafe .event > div .img_wrap a {
      display: block;
      position: relative;
      width: 100%;
      padding-top: 150%;
      overflow: hidden;
      background: #fff; }
      .creative_cafe .event > div .img_wrap a img {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        max-width: 150%;
        width: auto;
        max-height: 150%;
        height: auto; }
  .creative_cafe .event > div .txt_wrap {
    width: 66%;
    padding: 2.5em;
    background: #fff; }
    @media screen and (max-width: 768px) {
      .creative_cafe .event > div .txt_wrap {
        width: 100%; } }
    .creative_cafe .event > div .txt_wrap h2 {
      display: block;
      font-size: 24px;
      font-weight: bold;
      line-height: 1.5;
      color: #008bd5;
      margin: 0 0 10px; }
    .creative_cafe .event > div .txt_wrap time {
      display: block;
      margin: 0 0 32px; }
    .creative_cafe .event > div .txt_wrap div.text {
      line-height: 1.5; }
.creative_cafe .pick h3 {
  color: #ef8200; }
.creative_cafe .pick .pickup_list {
  list-style: none;
  display: flex;
  justify-content: left;
  flex-wrap: wrap;
  width: 100%; }
  @media screen and (max-width: 640px) {
    .creative_cafe .pick .pickup_list {
      display: block; } }
  .creative_cafe .pick .pickup_list li {
    width: 32%;
    margin: 0 2% 32px 0; }
    .creative_cafe .pick .pickup_list li:nth-child(3n) {
      margin-right: 0; }
    @media screen and (max-width: 768px) {
      .creative_cafe .pick .pickup_list li {
        width: 48%; }
        .creative_cafe .pick .pickup_list li:nth-child(3n) {
          margin-right: 2%; }
        .creative_cafe .pick .pickup_list li:nth-child(2n) {
          margin-right: 0; } }
    @media screen and (max-width: 640px) {
      .creative_cafe .pick .pickup_list li {
        width: 100%;
        margin-right: 0; } }
    .creative_cafe .pick .pickup_list li .img_wrap a {
      display: block;
      position: relative;
      width: 100%;
      height: 100%;
      padding-top: 66.666666667%;
      overflow: hidden;
      background: #ababab;
      margin: 0 0 10px; }
      .creative_cafe .pick .pickup_list li .img_wrap a img {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        max-width: 150%;
        width: auto;
        max-height: 150%;
        height: auto; }
    .creative_cafe .pick .pickup_list li .txt_wrap {
      width: 100%; }
      .creative_cafe .pick .pickup_list li .txt_wrap a {
        display: block;
        font-size: 20px;
        font-weight: bold;
        line-height: 1.4;
        color: #ef8200;
        margin: 0 0 10px; }
      .creative_cafe .pick .pickup_list li .txt_wrap time {
        display: block; }
.creative_cafe div.bth_wrap {
  text-align: center; }