@charset "UTF-8";
/*-------------------------------------------------------------
 	Photocon
-------------------------------------------------------------*/


/* = Clearfix
======================================*/
.cf:after {
    content:" ";
    display:block;
    clear:both;
}

#under.photocon #contents_section {
  margin-top: 0;
}

/* = BASE
======================================*/
#photoCon {
  text-align: center;
  padding-top: 150px;
  padding-bottom: 110px;
  background: url(../../img/photocon/bg-patarn.gif) repeat-x 0 0;
}

  #photoCon .wrap {
    width: 960px;
    height: auto;
    margin: 0 auto;
    position: relative;
  }

  @media screen and (max-width: 767px){
  #photoCon .wrap {
    width: 100%;
  }
  }
  #photoCon .wrap {
    width: 960px;
    height: auto;
    margin: 0 auto;
    position: relative;
  }

  @media screen and (max-width: 767px){
    #photoCon .wrap {
      width: 100%;
    }
  }

  #photoCon .wrap.wrap_wide {
    width: 1180px;
  }

  @media screen and (max-width: 1179px){
  #photoCon .wrap.wrap_wide {
    width: 100%;
  }
  }

  #photoCon .wrap .section {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
    text-align: left;
    margin-bottom: 50px;
  }

  @media screen and (max-width: 999px){
  #photoCon .wrap .section {
    width: 90%;
    margin: 0 5%;
    margin-bottom: 35px;
  }
  }

  #photoCon .wrap::after,
  #photoCon .wrap .section::after,
  #photoCon .section .title-group::after {
    content:" ";
    display:block;
    clear:both;
}

  #photoCon .wrap h2 {
    margin: 0 0 5px 0;
    height: auto;
    padding: 0;
    width: 100%;
    background-image: none;
  }

  #photoCon .okomin {
    position: absolute;
    top: 48px;
    right: 35px;
  }

  @media screen and (max-width: 999px){
  #photoCon .okomin {
    display: none;
  }
  }

  #photoCon dl.period {
  	color: #333;
  	margin: 2ex 5%;
    text-align: center;
  }
  #photoCon dl.period dt{
    border: 1px solid #333;
    padding: 0 4px;
    display: inline-block;
    font-size: 16px;
  }
  #photoCon dl.period dd{
    font-size: 18px;
    display: inline-block;
  }
  #photoCon dl.period span{
    display: inline-block;
  }

  #photoCon .result-msg {
    font-size: 28px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 35px;
    color: solid orange;
    border: 2px solid orange;
    border-radius: 5px;
    padding: 10px 30px;
  }

  @media screen and (max-width: 999px){
  #photoCon .result-msg {
    width: 90%;
    margin: 0 5% 25px 5%;
    padding: 0;
  }
  }

  #photoCon .result-note {
    margin: 0 5% 35px;
    font-size: 16px;
  }
  @media screen and (min-width: 1000px){
    #photoCon .wrap .section.section_single{
      width: 960px;
      margin-left: auto;
      margin-right: auto;
    }
  }
  @media screen and (min-width: 1000px){
    #photoCon .wrap .section.section_half{
      width: 960px;
      margin-left: auto;
      margin-right: auto;
    }
  }

  #photoCon .section .title-group {
    width: 100%;
    height: auto;
    position: relative;
    text-align: center;
  }

    #photoCon .section .title-group h3 {
      width: 100%;
      background: #efefef;
      height: auto;
      color: #000;
      border-radius: 5px;
      padding: 1ex 10px 1ex 70px;
      font-size: 20px;
      margin: 0;
      margin-bottom: 25px;
      position: relative;
      border-bottom: 1px solid #ddd;
      border-right: 1px solid #ddd;
      text-align: left;
      box-sizing: border-box;
      line-height: 1.3;
    }
    @media screen and (max-width: 767px){
      #photoCon .section .title-group h3 {
        padding-left: 90px;
      }
    }

    #photoCon .section .title-group h3.long {
      padding: 1ex 10px 1ex 100px;
   }



    #photoCon .section .title-group.okomin {
      top: 0 !important;
      left: 0 !important;
    }

    #photoCon .section.base .title-group h3 {
      font-size: 16px;
      padding: 1ex 10px 1ex 30px;
    }

    @media screen and (max-width: 767px){
    #photoCon .section.base .title-group h3 {
      text-align: center;
      padding: 1ex 15px;
    }

    #photoCon .section .title-group.okomin {
      display:block;
    }
    }

    #photoCon .section.base .title-group h3 span {
      background: solid orange;
      border-radius: 4px;
      padding: 0 12px 0 15px;
      color: #fff;
      margin-right: 10px;
    }

    @media screen and (max-width: 767px){
    #photoCon .section.base .title-group h3 span {
      padding: 0 12px;
      text-align: center;
      margin-right: 0;
      display: block;
    }
    }

    #photoCon .section.gold .title-group h3,
    #photoCon .section.silver .title-group h3 {
      font-size: 32px;
    }

    @media screen and (max-width: 767px){
    #photoCon .section.gold .title-group h3,
    #photoCon .section.silver .title-group h3 {
      font-size: 24px;
    }
    }

    #photoCon .section.gold .title-group h3::before {
      content: 'グランプリ';
      text-indent: -9999em;
      width: 160px;
      height: 160px;
      background: url(../../img/photocon/medal-gold.png) no-repeat 0 0;
      position: absolute;
      top: -50px;
      left: -60px;
    }

    @media screen and (max-width: 767px){
    #photoCon .section.gold .title-group h3::before {
      width: 80px;
      height: 80px;
      top: 50%;
      margin-top: -40px;
      left: 0;
      background-size: cover;
    }
    }

    #photoCon .section.silver .title-group h3::before {
      content: '準グランプリ';
      text-indent: -9999em;
      width: 120px;
      height: 120px;
      background: url(../../img/photocon/medal-silver.png) no-repeat 0 0;
      position: absolute;
      top: -15px;
      left: -40px;
    }

    @media screen and (max-width: 767px){
    #photoCon .section.silver .title-group h3::before {
      width: 80px;
      height: 80px;
      top: 50%;
      margin-top: -40px;
      left: 0;
      background-size: cover;
    }
    }

    #photoCon .section.blond .title-group h3::before {
      content: '';
      width: 100px;
      height: 100px;
      background: url(../../img/photocon/medal-blond.png) no-repeat 0 0;
      position: absolute;
      top: -20px;
      left: -30px;
    }

    #photoCon .section .title-group.blond h3::before {
      content: '';
      width: 100px;
      height: 100px;
      background: url(../../img/photocon/medal-blond.png) no-repeat 0 0;
      position: absolute;
      top: -20px;
      left: -30px;
    }

    @media screen and (max-width: 767px){
      #photoCon .section.blond .title-group h3::before {
        width: 80px;
        height: 80px;
        top: 50%;
        margin-top: -40px;
        left: 0;
        background-size: cover;
      }

      #photoCon .section .title-group.blond h3::before {
        width: 80px;
        height: 80px;
        top: 50%;
        margin-top: -40px;
        left: 0;
        background-size: cover;
      }
    }

    #photoCon .section.base .title-group h3::before {
      content: '';
      width: 60px;
      height: 60px;
      background: url(../../img/photocon/medal-base.png) no-repeat 0 0;
      position: absolute;
      top: -5px;
      left: -30px;
    }

    #photoCon .section .title-group.customer h3::before {
      content: 'お客様賞';
      text-indent: -9999em;
      width: 100px;
      height: 100px;
      background: url(../../img/photocon/medal-customer.png) no-repeat 0 0;
      position: absolute;
      top: -20px;
      left: -30px;
    }

    #photoCon .section .title-group.poster h3::before {
      content: 'ポスター賞';
      text-indent: -9999em;
      width: 100px;
      height: 100px;
      background: url(../../img/photocon/medal-poster.png) no-repeat 0 0;
      position: absolute;
      top: -20px;
      left: -30px;
    }

    #photoCon .section .title-group.okomin h3::before {
      content: 'おこみん賞';
      text-indent: -9999em;
      width: 100px;
      height: 100px;
      background: url(../../img/photocon/medal-okomin.png) no-repeat 0 0;
      position: absolute;
      top: -20px;
      left: -30px;
    }

    @media screen and (max-width: 767px){
    #photoCon .section.base .title-group h3::before {
      width: 60px;
      height: 60px;
      top: 50%;
      margin-top: -30px;
      left: -30px;
      background-size: cover;
      }

      #photoCon .section .title-group.customer h3::before,
      #photoCon .section .title-group.poster h3::before,
      #photoCon .section .title-group.okomin h3::before {
        width: 80px;
        height: 80px;
        top: 50%;
        margin-top: -40px;
        left: 0;
        background-size: cover;
      }
    }
    @media screen and (min-width: 768px){
      #photoCon .half_inner{
        display: flex;
        justify-content: space-between;
      }
    }

    #photoCon .section.attention {
      text-align: center;
      background: #ffffd7;
      border: 3px solid orange;
      padding: 15px;
      border-radius: 5px;
			box-sizing: border-box;
    }

    @media screen and (max-width: 767px){
    #photoCon .section.attention {
      box-sizing: border-box;
    }
    }

  #photoCon .section figure {
    width: auto;
    height: auto;
    text-align: center;
    margin: 0 auto 25px;
    z-index: 0;
    text-align: center;
  }
  @media screen and (min-width: 768px){
    #photoCon .section .figure_half{
      width: 49%;
    }
  }
  @media screen and (min-width: 768px){
    #photoCon .section_single figure{
      max-height: 800px;
    }
    #photoCon .section_single figure img{
      max-height: 800px;
    }
  }
  @media screen and (max-width: 767px){
    #photoCon .section figure{
      max-height: 50vh;
    }
    #photoCon .section figure img{
      max-height: 50vh;
    }
  }
  @media screen and (min-width: 768px){
    #photoCon .figure_half img{
      max-height: 400px;
    }
  }
  @media screen and (max-width: 767px){
    #photoCon .section .figure_half img{
      max-height: 60vw;
    }
  }
  #photoCon .section figure > a > img:hover {
    opacity: 0.7;
  }

  #photoCon .section figure img {
    -webkit-box-shadow: 0 10px 8px -6px #8d8c8c;
    -moz-box-shadow: 0 10px 8px -6px #8d8c8c;
     box-shadow: 0 10px 8px -6px #8d8c8c;
  }

  @media screen and (min-width: 768px){
    #photoCon .section .text_half{
      width: 49%;
    }
  }

  #photoCon .section .comment {
    border: 2px solid #ddd;
    border-radius: 5px;
    padding: 8px 20px;
    display: inline-block;
    position: relative;
    margin-bottom: 15px;
    font-size: 16px;
    text-align: left;
    background: #fff;
  }

  #photoCon .section .comment::before {
    content: '';
    border: 10px solid transparent;
    border-top: 10px solid #ddd;
    display: inline-block;
    position: absolute;
    bottom: -20px;
    left: 15px;
    z-index: 8;
  }

  #photoCon .section .comment::after {
    content: '';
    border: 8px solid transparent;
    border-top: 8px solid #fff;
    display: inline-block;
    position: absolute;
    bottom: -16px;
    left: 17px;
    z-index: 999;
  }

  /* Table */
  #photoCon .section table {
    width: 100%;
    height: auto;
    table-layout: fixed;
    background: #fff;
    border-collapse: collapse;
  }

    #photoCon .section table th,
    #photoCon .section table td {
      padding: 6px 8px;
      font-size: 16px;
      border: 1px solid #ddd;
    }

    #photoCon .section table th {
      background: #ffffe9;
      width: 110px;
      font-weight: normal;
      font-size: 80%;
    }

  /* 体裁 */
  #photoCon .column3 {
    width: 100%;
    height: auto;
    table-layout: fixed;
    padding-left: 0;
  }

    #photoCon .column3 > li {
      display: inline;
      float: left;
      width: 32%;
      margin-right: 2%;
    }

    @media screen and (max-width: 767px){
    #photoCon .column3 > li {
      width: 100%;
      margin-right: 0;
      margin-bottom: 40px;
    }
    }

    #photoCon .column3 > li:last-child {
      margin-bottom: 0;
      margin-right: 0;
    }


  /* 体裁 */
  #photoCon .photo-set {
    width: 100%;
    height: auto;
    box-sizing: border-box;
    padding-left: 0;
    margin-bottom:40px;
  }

  #photoCon .photo-set:after {
      content:" ";
      display:block;
      clear:both;
  }

  @media screen and (max-width: 767px){
  #photoCon .photo-set {
    border: 3px solid #ddd;
    padding: 15px;
  }
  }

    #photoCon .photo-set > li {
      display: inline;
      float: left;
    }

    #photoCon .photo-set > li:first-child {
      width: 240px;
    }

    @media screen and (max-width: 767px){
    #photoCon .photo-set > li:first-child {
      width: 100%;
    }
    }

    #photoCon .photo-set > li:nth-child(2) {
      width: 650px;
      float: right;
    }

    @media screen and (max-width: 767px){
    #photoCon .photo-set > li:nth-child(2) {
      width: 100%;
      float: right;
    }
    }

  .t-message {
    background: #fff;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 15px;
    border: 3px solid #ddd;
    padding: 10px 8px;
    border-radius: 5px;
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
  }

  @media screen and (max-width: 999px){
  .t-message {
    margin: 0 5%;
    width: 90%;
    font-size: 14px;
    box-sizing: border-box;
  }
  }
@media screen and (min-width: 768px){
  .set_comm-cont{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
  .set_comm-cont .comment,
  .set_comm-cont .contributor
  {
    width: 49%;
  }
  #photoCon .section .set_comm-cont .comment::before {
    border: 10px solid transparent;
    border-left: 10px solid #ddd;
    top: 15px;
    bottom: inherit;
    left: inherit;
    right: -20px;
  }
  #photoCon .section .set_comm-cont .comment::after {
    border: 8px solid transparent;
    border-left: 8px solid #fff;
    top: 17px;
    bottom: inherit;
    left: inherit;
    right: -16px;
  }
}

.contributor{
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  font-size: 16px;
}
.contributor > *:not(:first-child):not(:nth-child(2)){
  border-top: 1px solid #ccc;
}
.contributor dt{
  padding: 8px 5px 5px;
}
.contributor dd{
  padding:5px;
}
.contributor dt{
  width: 100px;
  font-size: 80%;
}
.contributor dd{
  width: calc(100% - 100px);
}


/* = 2017 Green season
======================================*/
#photoCon.photocon2017g{
background: url(../../img/photocon/g2017/bg-patarn.gif) repeat-x 0 0;
}
#photoCon.photocon2017g .wrap h2 {
  padding: 10px 0 0;
}
#photoCon .period {
  text-align: center;
	font-weight: bold;
	color: #1b7f5e;
	margin: -1em 5% 2em;
	font-size: 20px;
}

/* = 2018 Winter season
======================================*/

#photoCon.photocon2018g {
  background: url(../../img/photocon/g2018/ttl_bg.jpg) no-repeat;
  background-position: center -20px;
  background-size: 100% 170px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2018g {
    background-position: center 0px;
    background-size: 200%;
  }
}

#photoCon.photocon2018w .wrap h2 {
  padding: 10px 0 0;
}
#photoCon.photocon2018w .period {
	color: #6a3906;
}

/* = 2021 Winter season
======================================*/

#photoCon.photocon2021w {
  background: linear-gradient(180deg, #007fb6, #b3d9f3 150px, #fff 300px);
  padding-top: 110px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2021w {
    padding-top: 20px;
  }
}

#photoCon.photocon2021w .wrap h2 {
  padding: 0 10px 10px;
  margin-bottom: 2ex;
}
#photoCon.photocon2021w .okomin {
  top: 200px;
  right: 130px;
}
#photoCon.photocon2021w .result-msg{
  background: linear-gradient(90deg, #fff 0%, #f8e210 30%, #f8e210 70%, #fff 100%);
  color: #e6186f;
  border: none;
  border-radius: 0;
}
#photoCon .section.gold.dji .title-group h3::before {
  content:'DJI特別協賛';
  text-indent: -9999em;
  background-image: url(../../img/photocon/w2021/medal-dji.png) ;
}
#photoCon.photocon2021w .contributor dt{
  background-color: #f8e210;
  color: #e6186f;
}

/* = 2021 Green season
======================================*/

#photoCon.photocon2021g {
  background: linear-gradient(180deg, #00A7E3, #fff 300px);
  padding-top: 110px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2021g {
    padding-top: 20px;
  }
}

#photoCon.photocon2021g .wrap h2 {
  padding: 0 10px 10px;
  margin-bottom: 2ex;
}
#photoCon.photocon2021g .okomin {
  top: 130px;
  right: 100px;
}

#photoCon.photocon2021g dl.period dt {
  border: none;
  background-color: #000;
  color: #fff;
}

#photoCon.photocon2021g .result-msg{
  background: linear-gradient(90deg, #fff 0%,#00A7E3 30%,#00A7E3 70%, #fff 100%);
  color: #fff;
  border: none;
  border-radius: 0;
}
#photoCon.photocon2021g .contributor dt{
  background-color: #00A7E3;
  color: #fff;
}

/* = 2022 winter season
======================================*/

#photoCon.photocon2022w {
  background: linear-gradient(180deg, #b477ba, #fff 300px);
  padding-top: 110px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2022w {
    padding-top: 20px;
  }
}

#photoCon.photocon2022w .wrap h2 {
  padding: 0 10px 10px;
  margin-bottom: 2ex;
}
#photoCon.photocon2022w .okomin {
  top: 130px;
  right: 100px;
}

#photoCon.photocon2022w dl.period dt {
  border: none;
  background-color: #000;
  color: #fff;
}

#photoCon.photocon2022w .result-msg{
  background: linear-gradient(90deg, #fff 0%,#b477ba 30%,#b477ba 70%, #fff 100%);
  color: #fff;
  border: none;
  border-radius: 0;
}
#photoCon.photocon2022w .contributor dt{
  background-color: #b477ba;
  color: #fff;
}

/* = 2022 green season
======================================*/

#photoCon.photocon2022g {
  background: #fff;
  padding-top: 50px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2022g {
    padding-top: 20px;
  }
}

#photoCon.photocon2022g .wrap h2 {
  padding: 0 10px 10px;
  margin-bottom: 2ex;
}
#photoCon.photocon2022g .okomin {
  top: 130px;
  right: 100px;
}

#photoCon.photocon2022g dl.period dt {
  border: none;
  background-color: #fddd8d;
  color: #000;
}

#photoCon.photocon2022g .result-msg{
  background: linear-gradient(90deg, #fff 0%,#024d9c 30%,#024d9c 70%, #fff 100%);
  color: #fff;
  border: none;
  border-radius: 0;
}
#photoCon.photocon2022g .contributor dt{
  background-color: #024d9c;
  color: #fff;
}

/* = 2023 winter season
======================================*/

#photoCon.photocon2023w {
  background: linear-gradient(180deg, #E6EAF3, #fff 300px);
  padding-top: 60px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2023w {
    padding-top: 20px;
  }
}

#photoCon.photocon2023w .wrap h2 {
  padding: 0 10px 10px;
  margin-bottom: 2ex;
}
#photoCon.photocon2023w .okomin {
  top: 130px;
  right: 100px;
}

#photoCon.photocon2023w dl.period dt {
  border: none;
  background-color: #004892;
  color: #fff;
}

#photoCon.photocon2023w .result-msg{
  background: linear-gradient(90deg, #fff 0%,#E6EAF3 30%,#E6EAF3 70%, #fff 100%);
  color: #000;
  border: none;
  border-radius: 0;
}
#photoCon.photocon2023w .contributor dt{
  background-color: #E6EAF3;
  color: #000;
}


/* = 2023 green season
======================================*/

#photoCon.photocon2023g {
  background:  linear-gradient(180deg, #d9d2e6, #fff 300px);
  padding-top: 50px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2023g {
    padding-top: 20px;
  }
}

#photoCon.photocon2023g .wrap h2 {
  padding: 0 10px 10px;
  margin-bottom: 2ex;
}
#photoCon.photocon2023g .okomin {
  top: 130px;
  right: 100px;
}

#photoCon.photocon2023g dl.period dt {
  border: none;
  background-color: #bad8e8;
  color: #000;
}

#photoCon.photocon2023g .result-msg{
  background: linear-gradient(90deg, #fff 0%,#7b65b6 30%,#7b65b6 70%, #fff 100%);
  color: #fff;
  border: none;
  border-radius: 0;
}
#photoCon.photocon2023g .contributor dt{
  background-color: #6d9fe6;
  color: #fff;
}


/* = 2024 winter season
======================================*/

#photoCon.photocon2024w {
  background:  linear-gradient(180deg, #bbe2f1, #fff 300px);
  padding-top: 50px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2024w {
    padding-top: 20px;
  }
}

#photoCon.photocon2024w .wrap h2 {
  padding: 0 10px 10px;
  margin-bottom: 2ex;
}
#photoCon.photocon2024w .okomin {
  top: 130px;
  right: 100px;
}

#photoCon.photocon2024w dl.period dt {
  border: none;
  background-color: #82cddd;
  color: #000;
}

#photoCon.photocon2024w .result-msg{
  background: linear-gradient(90deg, #fff 0%,#0073a8 30%,#0073a8 70%, #fff 100%);
  color: #fff;
  border: none;
  border-radius: 0;
}
#photoCon.photocon2024w .contributor dt{
  background-color: #a4c1d7;
  color: #fff;
}


/* = 2024 green season
======================================*/

#photoCon.photocon2024g {
  background:  linear-gradient(180deg, #C4DB75, #fff 300px);
  padding-top: 50px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2024g {
    padding-top: 20px;
  }
}

#photoCon.photocon2024g .wrap h2 {
  padding: 0 10px 10px;
  margin-bottom: 2ex;
}
#photoCon.photocon2024g .okomin {
  top: 130px;
  right: 100px;
}

#photoCon.photocon2024g dl.period dt {
  border: none;
  background-color: #DAE140;
  color: #000;
}

#photoCon.photocon2024g .result-msg{
  background: linear-gradient(90deg, #fff 0%,#468839 30%,#468839 70%, #fff 100%);
  color: #fff;
  border: none;
  border-radius: 0;
}
#photoCon.photocon2024g .contributor dt{
  background-color: #faf0ca;
  color: #000;
}

/* = 2025 winter season
======================================*/

#photoCon.photocon2025w {
  background:  linear-gradient(180deg, #eddfea, #fff 300px);
  padding-top: 50px;
}
@media screen and (max-width: 767px){
  #photoCon.photocon2025w {
    padding-top: 20px;
  }
}

#photoCon.photocon2025w .wrap h2 {
  padding: 0 10px 10px;
  margin-bottom: 2ex;
}
#photoCon.photocon2025w .okomin {
  top: 130px;
  right: 100px;
}

#photoCon.photocon2025w dl.period dt {
  border: none;
  background-color: #a65f98;
  color: #fff799;
}

#photoCon.photocon2025w .result-msg{
  background: linear-gradient(90deg, #fff 0%,#a65f98 30%,#a65f98 70%, #fff 100%);
  color: #fff799;
  border: none;
  border-radius: 0;
}
#photoCon.photocon2025w .contributor dt{
  background-color: #e5c8f2;
  color: #000;
}