@charset "UTF-8";
/*/////////////////////////////
reset
/////////////////////////////*/
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, button {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

button {
  color: inherit;
  background: none;
  cursor: pointer;
  outline: none;
}

input, textarea {
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 0;
  background: none;
  -webkit-appearance: none;
}

ol, ul {
  list-style: none;
}

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

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q, blockquote {
  quotes: none;
}

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

a img {
  border: none;
}

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

/*/////////////////////////////
base
/////////////////////////////*/
body {
  color: #494949;
  line-height: 1.4285714286;
  letter-spacing: .08em;
  font-size: 14px;
  font-size: 3.7333333333vw;
  font-family: 'Noto Sans JP', "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, Meiryo, "メイリオ", sans-serif;
  word-break: break-word;
  background-color: #9fc2d4;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -webkit-font-feature-settings: "palt";
  font-feature-settings: "palt";
}

@media screen and (min-width: 481px) {
  body {
    font-size: 14px;
  }
}
/* list
* ------------------------- */
li {
  list-style: none;
}

/* link
* ------------------------- */
a {
  text-decoration: none;
  color: inherit;
}

/* img
* ------------------------- */
img {
  max-width: 100%;
  height: auto;
  outline: none;
  display: block;
}

a img {
  border: 0px;
}

img[src$=".svg"] {
  width: 100%;
}

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

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

/* other
* ------------------------- */
/* linkbox */
.linkbox {
  cursor: pointer;
}

/* br */
br.pc {
  display: none;
}

/* wrap */
#wrap.fixed {
  position: fixed;
  width: 100%;
  height: 100%;
}

@media screen and (min-width: 812px) {
  br.pc {
    display: inline;
  }

  br.sp {
    display: none;
  }
}
b {
  font-weight: bold;
}

/* ==========================================================
Yosemile
Created: 2020-06

00.common
01.header
02.main
03.modal
04.aboutBlock
05.indexblock
06.otherBlock
07.loginBlock
08.footer
========================================================== */
/*/////////////////////////////
00. common
- 1.container
- 2.spacer
- 3.topBlock
- 4.inputBlock
- 5.submitBtn
- 6.lowBlock
- 7.modBtn
- 8.cnvBlock
- 9.candidate
- 10.selectRelease
- 11.snsRegist
- 12.checkText
- 13.profile
- 14.acBox
/////////////////////////////*/
/* 1.container
* ------------------------- */
.container {
  max-width: 768px;
  margin: 0 auto;
}

/* 2.spacer
* ------------------------- */
.spacer {
  padding: 0 1.0714285714em;
}

/* 3.topBlock
* ------------------------- */
.topBlock {
  background: #9fc2d4;
  padding: 5px 0 1.4285714286em;
}
.topBlock .box {
  background: #fff;
  border-radius: 6px;
  padding: 1.0714285714em 1.0714285714em 2.1428571429em;
}
.topBlock .hint {
  margin-top: 0.3571428571em;
  text-align: right;
  position: relative;
}
.topBlock .hint > p a {
  color: #9fc2d4;
  font-size: 0.8571428571em;
  text-decoration: underline;
  display: inline-block;
  position: relative;
}
.topBlock .hint > p a:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 0.625em;
  height: 0.9583333333em;
  background: url("../images/hint.svg") no-repeat;
  background-position: center center;
  background-size: contain;
  margin-right: .5em;
}
.topBlock .hint > p a:hover {
  text-decoration: none;
}
.topBlock .hint > p a:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px;
  border-color: transparent #fff #fff transparent;
  position: absolute;
  top: 100%;
  left: 50%;
  margin: 2px 0 0 -10px;
  transition: all .4s ease;
  opacity: 0;
  visibility: hidden;
}
.topBlock .hint > p a.open {
  z-index: 101;
}
.topBlock .hint > p a.open:after {
  transition-delay: .2s;
  opacity: 1;
  visibility: visible;
}
.topBlock .hint .popup {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 101;
  background: #fff;
  margin-top: 12px;
  border-radius: 7px;
  text-align: left;
  display: none;
}
.topBlock .hint .popup .wrap {
  padding: 2.5em 1.0714285714em;
}
.topBlock .hint .popup ul {
  font-size: 0.8571428571em;
  line-height: 1.6666666667;
  padding-left: 1.5em;
}
.topBlock .hint .popup ul li {
  list-style: disc;
}
.topBlock .hint .popup .close {
  display: block;
  width: 15px;
  height: 0;
  padding-top: 15px;
  position: absolute;
  top: 0.8928571429em;
  right: 0.5em;
  overflow: hidden;
}
.topBlock .hint .popup .close:before, .topBlock .hint .popup .close:after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: #4a4a4a;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -.5px 0 0 -7.5px;
}
.topBlock .hint .popup .close:before {
  transform: rotate(45deg);
}
.topBlock .hint .popup .close:after {
  transform: rotate(-45deg);
}
.topBlock .boardTitle {
  margin-bottom: 1.0714285714em;
}
.topBlock .boardTitle:last-child {
  margin-bottom: 0;
}
.topBlock .boardTitle:last-child .text {
  border-bottom: none;
  padding-bottom: 0;
}
.topBlock .boardTitle .titleText {
  font-size: 1.1428571429em;
  line-height: 1.375;
  margin: 0.8571428571em 0 0.5714285714em;
  text-align: center;
  font-weight: bold;
}
.topBlock .boardTitle .text {
  line-height: 1.5;
  margin-top: 0.5714285714em;
  border-bottom: #9fc2d4 1px solid;
  padding-bottom: 1.0714285714em;
}
.topBlock .boardTitle .ut {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: flex-start;
}
.topBlock .boardTitle .ut .releaseIcon {
  width: 6.6666666667em;
  color: #fff;
  font-size: 0.8571428571em;
  line-height: 1.6666666667;
  text-align: center;
  background-color: #9fc2d4;
  border-radius: 3px;
}
.topBlock .boardTitle .ut .releaseIcon:before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: middle;
  margin-right: 0.4166666667em;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  position: relative;
  top: -1px;
}
.topBlock .boardTitle .ut .releaseIcon.release:before {
  background-image: url("../images/release-wh.svg");
}
.topBlock .boardTitle .ut .releaseIcon.unRelease:before {
  background-image: url("../images/release_ltd-wh.svg");
}
.topBlock .boardTitle .ut .editLink {
  width: 2.1428571429em;
  margin-left: auto;
}
.topBlock .boardTitle .ut .editLink a {
  display: block;
}
.topBlock .boardTitle .releaseText {
  color: #c8c8c8;
  font-size: 0.7142857143em;
  line-height: 1;
  margin-top: 0.3571428571em;
}
.topBlock .textArea {
  margin-bottom: 1.7857142857em;
}
.topBlock .textArea p {
  line-height: 1.5714285714;
}
.topBlock .deleteLink {
  text-align: center;
  margin-top: 1.7857142857em;
}
.topBlock .deleteLink a {
  color: #9fc2d4;
  font-size: 0.8571428571em;
  font-weight: bold;
  text-decoration: underline;
}
.topBlock .deleteLink a:hover {
  text-decoration: none;
}
.topBlock .note {
  font-size: 0.8571428571em;
  font-weight: bold;
  text-align: center;
  margin-top: 1.7857142857em;
}
.topBlock .subnote {
  color: #b4b4b4;
  font-size: 0.8571428571em;
  text-align: center;
  margin-top: 1.0714285714em;
}
.topBlock .title {
  font-size: 1.2857142857em;
  font-weight: bold;
  text-align: center;
  margin: 1.4285714286em 0 1.7857142857em;
}
.topBlock .title .s {
  font-size: 0.6666666667em;
  font-weight: normal;
  line-height: 1;
  display: block;
  margin-top: 0.8333333333em;
}
.topBlock.maltiLogin .subLogin {
  margin-top: 2.1428571429em;
  padding-top: 2em;
  border-top: #9fc2d4 1px solid;
}
.topBlock.maltiLogin .subLogin .text {
  font-size: 0.8571428571em;
  text-align: center;
  margin-bottom: 1.0714285714em;
}
.topBlock.maltiLogin .subLogin .title:first-child {
  margin-top: 0;
}
.topBlock.maltiLogin .subLogin .link {
  text-align: center;
}
.topBlock.maltiLogin .subLogin .link a {
  color: #9fc2d4;
  font-weight: bold;
  letter-spacing: .08em;
  text-decoration: underline;
}
.topBlock.maltiLogin .subLogin .link a:hover {
  text-decoration: none;
}
.topBlock.maltiLogin .subText {
  text-align: center;
  margin-top: 1.4285714286em;
}
.topBlock.maltiLogin .subText + .submitBtn {
  margin-top: 1.4285714286em;
}
.topBlock.maltiLogin .toTop {
  text-align: center;
  margin-top: 1.4285714286em;
}
.topBlock.maltiLogin .toTop a {
  color: #9fc2d4;
  font-weight: bold;
  text-decoration: underline;
}
.topBlock.maltiLogin .toTop a:hover {
  text-decoration: none;
}
.topBlock.maltiLogin .mailloginArea {
  display: none;
  padding-top: 0.7142857143em;
}
.topBlock.maltiLogin .mailloginArea .title:first-child {
  margin-top: 0;
}
.topBlock.maltiLogin .mailBtn {
  width: 17.8571428571em;
  max-width: 250px;
  margin: 0 auto;
}
.topBlock.maltiLogin .mailBtn .modBtn:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 1.4285714286em;
  height: 1.0714285714em;
  background: url("../images/icon_mail.svg") no-repeat;
  background-position: center center;
  background-size: contain;
  margin-right: 0.7142857143em;
  position: relative;
  top: -2px;
}
.topBlock.maltiLogin .registBtn .btn {
  background: url("../images/icon_mail.svg") no-repeat;
  background-position: 2.1428571429em center;
  background-size: 1.4285714286em auto;
  padding-left: 1.4285714286em;
}
.topBlock.maltiLogin .registBtn.is-hidden {
  display: none;
}
.topBlock.maltiLogin .complete {
  padding-top: 0.7142857143em;
}
.topBlock.maltiLogin .complete .mailComp {
  color: #9fc2d4;
  font-size: 1.4285714286em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1.5em;
}
.topBlock.maltiLogin .complete .compText,
.topBlock.maltiLogin .complete .address {
  text-align: center;
}
.topBlock.maltiLogin .complete .address {
  font-weight: bold;
  margin: 2.1428571429em;
}
.topBlock.maltiLogin .compBlock + .compBlock {
  margin-top: 1.6428571429em;
}
.topBlock.maltiLogin .compBlock .cap {
  text-align: center;
  font-weight: bold;
  margin-bottom: 0.7142857143em;
}
.topBlock.maltiLogin .checkText {
  margin-bottom: 0;
}
.topBlock.maltiLogin .checkText + .submitBtn {
  margin-top: 1.9285714286em;
}
.topBlock.maltiLogin .privacypolicy {
  text-align: center;
  margin: 1.0714285714em 0 1.9285714286em;
}
.topBlock.maltiLogin .privacypolicy a {
  color: #9fc2d4;
  font-size: 0.8571428571em;
  text-decoration: underline;
}
.topBlock.maltiLogin .privacypolicy a:hover {
  text-decoration: none;
}

/* 4.inputBlock
* ------------------------- */
.inputBlock + .inputBlock {
  margin-top: 1.4285714286em;
}
.inputBlock + .submitBtn {
  margin-top: 2.1428571429em;
}
.inputBlock dt {
  margin-bottom: 0.7142857143em;
  position: relative;
}
.inputBlock dt .req {
  color: #fff;
  font-size: 0.7142857143em;
  line-height: 1.4;
  background: #9fc2d4;
  padding: 0 0.5em;
  border-radius: 3px;
  display: inline-block;
  margin-left: 1em;
  position: relative;
  top: -0.1em;
}
.inputBlock dt .notice {
  font-size: 0.7857142857em;
  display: block;
  margin-top: 0.2727272727em;
}
.inputBlock .inputWrap {
  position: relative;
}
.inputBlock .inputWrap .count {
  color: #c8c8c8;
  font-size: 0.8571428571em;
  line-height: 1;
  display: block;
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 0.4166666667em;
}
.inputBlock .inputWrap .accountCandidate {
  max-height: 15.8928571429em;
  position: absolute;
  right: 0;
  left: 0;
  top: 100%;
  z-index: 5;
  background: #fff;
  border: #ededec 1px solid;
  border-radius: 0 0 8px 8px;
  overflow: auto;
  margin-top: -6px;
  display: none;
}
.inputBlock .inputWrap .accountCandidate .list li {
  border-top: #ededec 1px solid;
}
.inputBlock .inputWrap .accountCandidate .list li:first-child {
  border-top: none;
}
.inputBlock .inputWrap .accountCandidate .list li button {
  text-align: left;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  padding: 0.7142857143em;
  display: block;
}
.inputBlock .inputWrap .accountCandidate .list li .listInner {
  width: 100%;
  display: table;
  table-layout: fixed;
}
.inputBlock .inputWrap .accountCandidate .list li .listInner > * {
  display: table-cell;
  vertical-align: top;
}
.inputBlock .inputWrap .accountCandidate .list li .listInner .icon {
  width: 2.5em;
  padding-top: 0.2142857143em;
}
.inputBlock .inputWrap .accountCandidate .list li .listInner .name {
  padding-left: 0.7142857143em;
}
.inputBlock .inputWrap .accountCandidate .list li .listInner .name .sub {
  color: #787878;
  font-size: 0.8571428571em;
  line-height: 1.6666666667;
}
.inputBlock .messageWrap {
  position: relative;
}
.inputBlock .messageWrap .count {
  color: #c8c8c8;
  font-size: 0.8571428571em;
  line-height: 1;
  display: block;
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 0.4166666667em;
}
.inputBlock .messageWrap .input {
  box-sizing: border-box;
  min-height: 22.5em;
  padding: 2.8571428571em 0;
  overflow: hidden;
  border-radius: 8px;
  border: #ededec 1px solid;
  position: relative;
  display: flex;
  align-items: center;
}
.inputBlock .messageWrap .input.bg02 {
  border-color: transparent;
  background-color: #ededec;
}
.inputBlock .messageWrap .input.bg03 {
  border-color: transparent;
  background-color: #efb7b6;
}
.inputBlock .messageWrap .input.bg04 {
  border-color: transparent;
  background-color: #93c7d0;
}
.inputBlock .messageWrap .input.bg05 {
  border-color: transparent;
  background-color: #f7d36b;
}
.inputBlock .messageWrap .input .name {
  color: #787878;
  font-size: 0.8571428571em;
  line-height: 1;
  text-align: center;
  position: absolute;
  right: 0;
  bottom: 1.2857142857em;
  left: 0;
}
.inputBlock .messageWrap .input .name .thumbnail {
  width: 60px;
  margin: 0 auto;
  position: relative;
}
.inputBlock .messageWrap .input .name a.delete {
  width: 22px;
  display: inline-block;
  position: absolute;
  right: -10px;
  top: -10px;
}
.inputBlock .messageWrap .input .name.official .username {
  margin-top: .5em;
}
.inputBlock .messageWrap .input .name.official .username:after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 1.1428571429em;
  height: 1.1428571429em;
  background: url("../images/icon_official.png") no-repeat;
  background-position: center center;
  background-size: contain;
  margin-left: .5em;
}
.inputBlock .messageWrap .input .bg {
  width: 100%;
}
.inputBlock .messageWrap textarea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  color: #494949;
  font-size: 16px;
  letter-spacing: .08em;
  line-height: 22px;
  text-align: center;
  width: 100%;
  height: 44px;
  padding: 12px 10px 10px;
  outline: none;
  overflow: hidden;
}
.inputBlock .colorSelect {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.inputBlock .colorSelect label {
  display: block;
  width: 3.9285714286em;
  position: relative;
  margin-left: 0.7142857143em;
}
.inputBlock .colorSelect label:first-child {
  margin-left: 0;
}
.inputBlock .colorSelect label input {
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  padding-top: 100%;
  border-radius: 100%;
  outline: none;
}
.inputBlock .colorSelect label input:checked + .text:before {
  opacity: 1;
}
.inputBlock .colorSelect label .text {
  display: block;
}
.inputBlock .colorSelect label .text:before {
  content: "";
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 15px;
  height: 8px;
  border-left: #464646 2px solid;
  border-bottom: #464646 2px solid;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -4px 0 0 -7.5px;
  -webkit-transform: rotate(-35deg);
  transform: rotate(-35deg);
  opacity: 0;
}
.inputBlock .colorSelect label .text span {
  display: block;
  height: 0;
  overflow: hidden;
}
.inputBlock .colorSelect label.c1 input {
  background: #fff;
  border: #ededec 2px solid;
  padding-top: calc(100% - 4px);
}
.inputBlock .colorSelect label.c2 input {
  background: #ededec;
}
.inputBlock .colorSelect label.c3 input {
  background: #efb7b6;
}
.inputBlock .colorSelect label.c4 input {
  background: #93c7d0;
}
.inputBlock .colorSelect label.c5 input {
  background: #f7d36b;
}
.inputBlock .inputText,
.inputBlock .inputTextarea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  font-size: 16px;
  width: 100%;
  padding: 12px 10px 10px;
  background: #f0f5fa;
  border-radius: 8px;
}
.inputBlock .inputText[disabled],
.inputBlock .inputTextarea[disabled] {
  background: #c8c8c8;
}
.inputBlock .inputTextarea {
  height: 12.5em;
}
.inputBlock .inputTextarea.low {
  height: 7.1428571429em;
}
.inputBlock .inputText::-webkit-input-placeholder, .inputBlock .inputTextarea::-webkit-input-placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.inputBlock .inputText::-moz-placeholder, .inputBlock .inputTextarea::-moz-placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.inputBlock .inputText:-ms-input-placeholder, .inputBlock .inputTextarea:-ms-input-placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.inputBlock .inputText::-ms-input-placeholder, .inputBlock .inputTextarea::-ms-input-placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.inputBlock .inputText::placeholder,
.inputBlock .inputTextarea::placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.inputBlock dd .alert {
  color: #e65a46;
  font-size: 0.8571428571em;
  line-height: 1.3333333333;
  text-indent: -1em;
  padding: 0 3.3333333333em 0 1em;
  margin-top: 0.4166666667em;
}
.inputBlock .selectWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.inputBlock .selectWrap .text {
  margin: 0 0.5714285714em;
}
.inputBlock .selectWrap .text:last-child {
  margin-right: 0;
}
.inputBlock .selectWrap .selectInput {
  width: 5.2142857143em;
}
.inputBlock .selectInput label {
  display: block;
  position: relative;
}
.inputBlock .selectInput label select {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 2.8125em;
  font-size: 16px;
  line-height: 2.8125;
  background: #f0f5fa;
  padding: 0 0.9375em 0 0.3125em;
  margin: 0;
  border: none;
  border-radius: 8px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.inputBlock .selectInput label select::-ms-expand {
  display: none;
}
.inputBlock .selectInput label:after {
  content: "";
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 6px;
  height: 6px;
  border-right: #787878 2px solid;
  border-bottom: #787878 2px solid;
  position: absolute;
  top: 50%;
  right: 0.375em;
  margin-top: -3px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  pointer-events: none;
}
.inputBlock .boadSelect label {
  display: block;
  position: relative;
}
.inputBlock .boadSelect label select {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 2.6875em;
  font-size: 16px;
  line-height: 2.6875;
  background: #fff;
  padding: 0 1.5625em 0 0.625em;
  margin: 0;
  border: #d6d6d6 1px solid;
  border-radius: 8px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.inputBlock .boadSelect label select::-ms-expand {
  display: none;
}
.inputBlock .boadSelect label:after {
  content: "";
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 6px;
  height: 6px;
  border-right: #7b7b7b 2px solid;
  border-bottom: #7b7b7b 2px solid;
  position: absolute;
  top: 50%;
  right: 0.8125em;
  margin-top: -3px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  pointer-events: none;
}

/* 5.submitBtn
* ------------------------- */
.submitBtn {
  width: 17.8571428571em;
  max-width: 250px;
  margin: 0 auto;
}
.submitBtn .btn {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%;
  color: #9fc2d4;
  font-weight: bold;
  letter-spacing: .08em;
  text-align: center;
  line-height: 3.5714285714em;
  border: #9fc2d4 1px solid;
  border-radius: 1.7857142857em;
  outline: none;
  cursor: pointer;
}
.submitBtn .regist + * {
  margin-top: 0.7142857143em;
}
.submitBtn .link {
  text-align: center;
  margin-top: 1.4285714286em;
}
.submitBtn .link a {
  color: #9fc2d4;
  font-size: 0.8571428571em;
  text-decoration: underline;
}
.submitBtn .link a:hover {
  text-decoration: none;
}

/* 6.lowBlock
* ------------------------- */
.lowBlock {
  padding: 2.1428571429em 0 45px;
  background-color: #fff;
}

/* 7.modBtn
* ------------------------- */
.modBtn {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%;
  color: #9fc2d4;
  font-weight: bold;
  letter-spacing: .08em;
  text-align: center;
  line-height: 4.1428571429em;
  border: #9fc2d4 1px solid;
  background: #fff;
  border-radius: 2.1428571429em;
  outline: none;
  cursor: pointer;
}

/* 8.cnvBlock
* ------------------------- */
.cnvBlock {
  background: #9fc2d4;
  padding: 2.1428571429em 0;
}
.cnvBlock .text {
  color: #fff;
  font-size: 1.4285714286em;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  margin-bottom: 1.5em;
}
.cnvBlock .box {
  background: #fff;
  border-radius: 6px;
  padding: 2.1428571429em 1.0714285714em;
}
.cnvBlock .box .mail {
  margin-bottom: 1.7857142857em;
}
.cnvBlock .box .mail input {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  font-size: 16px;
  width: 100%;
  padding: 12px 10px 10px;
  background: #f0f5fa;
  border-radius: 8px;
}
.cnvBlock .box .mail input::-webkit-input-placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.cnvBlock .box .mail input::-moz-placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.cnvBlock .box .mail input:-ms-input-placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.cnvBlock .box .mail input::-ms-input-placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.cnvBlock .box .mail input::placeholder {
  font-size: 14px;
  color: #c8c8c8;
}
.cnvBlock .box .agree {
  text-align: center;
  margin-bottom: 2.1428571429em;
}
.cnvBlock .box .agree p {
  font-size: 0.8571428571em;
}
.cnvBlock .box .agree p label {
  display: inline-block;
  line-height: 2.5;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}
.cnvBlock .box .agree p label span {
  display: block;
  padding-left: 3.3333333333em;
}
.cnvBlock .box .agree p label span:before, .cnvBlock .box .agree p label span:after {
  content: "";
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  position: absolute;
  top: 50%;
}
.cnvBlock .box .agree p label span:before {
  width: 2.5em;
  height: 2.5em;
  background: #f0f5fa;
  border-radius: 5px;
  left: 0;
  margin-top: -1.25em;
  z-index: 1;
}
.cnvBlock .box .agree p label span:after {
  width: 1.25em;
  height: 0.6666666667em;
  border-bottom: #494949 2px solid;
  border-left: #494949 2px solid;
  left: 0.625em;
  margin-top: -0.5em;
  -webkit-transform: rotate(-35deg);
  transform: rotate(-35deg);
  z-index: 2;
}
.cnvBlock .box .agree p label input {
  display: block;
  width: 2.0833333333em;
  height: 2.0833333333em;
  position: absolute;
  top: 50%;
  right: 100%;
  border-collapse: separate;
  outline: none;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-box-shadow: 2.2916666667em 0 #f0f5fa;
  box-shadow: 2.2916666667em 0 #f0f5fa;
  z-index: 3;
}
.cnvBlock .box .agree p label input:checked {
  -webkit-box-shadow: none;
  box-shadow: none;
}

/* 9.candidate
* ------------------------- */
.candidate {
  margin: 1.0714285714em 0 0;
}
.candidate + .inputBlock {
  margin-top: 1.4285714286em;
}
.candidate .candidateList + .candidateList {
  margin-top: 0.7142857143em;
}
.candidate .candidateList .name {
  display: inline-block;
  background: #9fc2d4;
  color: #fff;
  border-radius: 3px;
  padding: 5px 0.5714285714em 5px 1.7142857143em;
  position: relative;
}
.candidate .candidateList .name span {
  font-size: 0.8571428571em;
  letter-spacing: .08em;
}
.candidate .candidateList .name .delete {
  display: block;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  width: 0.9285714286em;
  height: 0;
  padding-top: 0.9285714286em;
  overflow: hidden;
  border: #fff 1px solid;
  border-radius: 100%;
  position: absolute;
  top: 50%;
  left: 0.3571428571em;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.candidate .candidateList .name .delete:before, .candidate .candidateList .name .delete:after {
  content: "";
  display: block;
  width: 0.5em;
  height: 1px;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
}
.candidate .candidateList .name .delete:before {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  transform: translate(-50%, -50%) rotate(45deg);
}
.candidate .candidateList .name .delete:after {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* 10.selectRelease
* ------------------------- */
.selectRelease {
  height: 3.5714285714em;
}
.selectRelease input[type="radio"] {
  display: none;
}
.selectRelease .select {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 3.5714285714em;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.selectRelease .select:before {
  content: "";
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 3.5714285714em;
  height: 3.5714285714em;
  border-left: #d6d6d6 1px solid;
  background-image: url("../images/select.svg");
  background-position: center center;
  background-size: 9px auto;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  pointer-events: none;
}
.selectRelease .select:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  z-index: 3;
  cursor: pointer;
}
.selectRelease .select > li {
  width: 100%;
  height: 3.5714285714em;
  position: absolute;
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
}
.selectRelease .select > li.active {
  z-index: 1;
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}
.selectRelease .select > li.active .in {
  background-color: #fff;
  border: #d6d6d6 1px solid;
}
.selectRelease .select > li .in {
  background-color: #ededec;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: hidden;
  padding: 0 3.5714285714em 0 2.8571428571em;
  background-repeat: no-repeat;
  background-position: 0.7142857143em center;
  background-size: 1.5714285714em auto;
  border-radius: 6px;
}
.selectRelease .select > li .in.release {
  background-image: url("../images/release.svg");
}
.selectRelease .select > li .in.unrelease {
  background-image: url("../images/release_ltd.svg");
}
.selectRelease .select > li .in .status,
.selectRelease .select > li .in .text {
  line-height: 1.2857142857;
  display: block;
}
.selectRelease .select > li .in .text {
  color: #787878;
  font-size: 0.7142857143em;
  letter-spacing: normal;
}
.selectRelease .select.open {
  height: auto;
}
.selectRelease .select.open:after {
  display: none;
}
.selectRelease .select.open > li {
  position: relative;
}
.selectRelease .select.open > li.active .in {
  border-radius: 6px 6px 0 0;
}
.selectRelease .select.open > li .in {
  border-radius: 0 0 6px 6px;
}
.selectRelease .select.open > li > label {
  width: 100%;
  height: 100%;
  display: block;
}

/* 11.snsRegist
* ------------------------- */
.snsRegist {
  width: 17.8571428571em;
  max-width: 250px;
  margin: 0 auto;
}
.snsRegist ul li {
  margin-bottom: 1.4285714286em;
}
.snsRegist ul li a {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  color: #9fc2d4;
  font-weight: bold;
  letter-spacing: .08em;
  text-align: center;
  line-height: 4.1428571429em;
  border-radius: 2.1428571429em;
  border: #9fc2d4 1px solid;
}
.snsRegist ul li a:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 1.6428571429em;
  height: 1.6428571429em;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  margin-right: 0.7142857143em;
  position: relative;
  top: -2px;
}
.snsRegist ul li a.tw:before {
  background-image: url("../images/icon_tw.svg");
}
.snsRegist ul li a.fb:before {
  background-image: url("../images/icon_fb.svg");
}

/* 12.checkText
* ------------------------- */
.checkText {
  text-align: center;
  margin: 1.9285714286em 0;
}
.checkText label {
  display: inline-block;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}
.checkText label span {
  display: block;
  padding-left: 2.5em;
  line-height: 1.7857142857;
}
.checkText label span:before {
  content: "";
  display: block;
  width: 1.7857142857em;
  height: 1.7857142857em;
  background-color: #f0f5fa;
  border-radius: 6px;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -0.8928571429em;
  z-index: 1;
}
.checkText label span:after {
  content: "";
  display: block;
  width: 0.7142857143em;
  height: 0.7142857143em;
  background-color: #9fc2d4;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 0.5357142857em;
  margin-top: -0.3571428571em;
  z-index: 2;
  opacity: 0;
}
.checkText input[type="checkbox"] {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.checkText input[type="checkbox"]:checked + span:after {
  opacity: 1;
}

/* 13.profile
* ------------------------- */
.profile {
  margin: 0.5714285714em 0 1.7857142857em;
}
.profile .profHead {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin-bottom: 1.2857142857em;
}
.profile .profHead > * {
  display: table-cell;
  vertical-align: middle;
}
.profile .profHead .icon {
  width: 4.2857142857em;
  height: 4.2857142857em;
}
.profile .profHead .icon span {
  display: block;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
  background-image: url("../images/blank_icon.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.profile .profHead .icon .iconBtn {
  display: block;
  width: 100%;
  height: 0;
  padding-top: 100%;
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: url("../images/icon_camera.svg") no-repeat;
  background-position: center center;
  background-size: 1.7857142857em auto;
}
.profile .profHead .detail {
  padding-left: 1.4285714286em;
}
.profile .profHead .detail .name {
  font-size: 1.2857142857em;
  font-weight: bold;
  line-height: 1.1111111111;
}
.profile .profHead .detail .inputName {
  color: #9fc2d4;
  font-size: 16px;
  letter-spacing: .08em;
  display: block;
  width: 100%;
  padding: 0 4px 10px;
  border-bottom: #9fc2d4 1px solid;
  outline: none;
}
.profile .profBody .profText {
  line-height: 1.7142857143;
}
.profile .profBody .notification {
  margin-top: 1.4285714286em;
}
.profile .profBody .notification .text {
  margin-bottom: 0.7142857143em;
}
.profile .profBody .notification .notificationList li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0.8571428571em 0;
  border-bottom: #f0f5fa 1px solid;
}
.profile .profBody .notification .notificationList li:first-child {
  border-top: #f0f5fa 1px solid;
}
.profile .profBody .notification .notificationList li .type p {
  line-height: 1.333;
}
.profile .profBody .notification .notificationList li .check {
  width: 2.8571428571em;
}
.profile .profBody .notification .notificationList li .check .sw {
  display: block;
}
.profile .profBody .notification .notificationList li .check .sw label span {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 1.4285714286em;
  overflow: hidden;
  background: #fff;
  border: #9fc2d4 1px solid;
  border-radius: 0.7142857143em;
  position: relative;
  -webkit-transition: background-color .2s ease;
  transition: background-color .2s ease;
}
.profile .profBody .notification .notificationList li .check .sw label span:before {
  content: "";
  display: block;
  width: 1.1428571429em;
  height: 1.1428571429em;
  background-color: #c8c8c8;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 0.0714285714em;
  margin-top: -0.5714285714em;
  -webkit-transition: background-color .2s ease, left .2s ease;
  transition: background-color .2s ease, left .2s ease;
}
.profile .profBody .notification .notificationList li .check .sw input {
  position: absolute;
  right: 105%;
  top: 0;
}
.profile .profBody .notification .notificationList li .check .sw input:checked + span {
  background-color: #9fc2d4;
}
.profile .profBody .notification .notificationList li .check .sw input:checked + span:before {
  background-color: #fff;
  left: 1.5em;
}

/* 14.acBox
* ------------------------- */
.acBox {
  margin-top: 2.1428571429em;
  border-radius: 6px;
  border: #9fc2d4 1px solid;
  overflow: hidden;
}
.acBox:first-child {
  margin-top: 0;
}
.acBox + * {
  margin-top: 2.5em;
}
.inputBlock .acBox {
  border: #d6d6d6 1px solid;
}
.acBox .heading a {
  color: #fff;
  font-weight: bold;
  text-align: center;
  line-height: 3.5;
  display: block;
  background: #9fc2d4;
  position: relative;
}
.inputBlock .acBox .heading a {
  color: #7b7b7b;
  background: #fff;
  text-align: left;
  padding: 0.822em 0.7143em;
}
.inputBlock .acBox .heading a.open {
  border-bottom: #d6d6d6 1px solid;
}
.inputBlock .acBox .heading a img {
  width: 1.2865em;
}
.acBox .heading a:after {
  content: "";
  display: block;
  box-sizing: border-box;
  width: 8px;
  height: 8px;
  border-right: #fff 1px solid;
  border-bottom: #fff 1px solid;
  position: absolute;
  top: 50%;
  right: 0.8571428571em;
  margin-top: -6px;
  transform: rotate(45deg);
}
.inputBlock .acBox .heading a:after {
  border-color: #7b7b7b;
}
.acBox .heading a.open:after {
  transform: rotate(-135deg);
  margin-top: -2px;
}
.acBox .body {
  padding: 2.1428571429em 0 1.4285714286em;
}
.inputBlock .acBox .body {
  padding: 6.4285714287em 0;
  position: relative;
}
.inputBlock .acBox .body {
  padding: 6.4285714287em 0;
  position: relative;
}
.inputBlock .acBox .body.dragableArea.has-advanced-upload {
  background-color: #eee;
  outline: 1px dashed #aaa;
  outline-offset: -10px;
}
.inputBlock .acBox .body.thumbnailArea {
  padding: 0.822em 0.7143em;
}
.inputBlock .acBox .body.thumbnailArea .thumbnail {
  width: 382px;
  max-width: 100%;
  position: relative;
}
.inputBlock .acBox .body.thumbnailArea.area--sq .thumbnail {
  width: 200px;
}
.inputBlock .acBox .body.thumbnailArea .thumbnail a.delete {
  width: 22px;
  position: absolute;
  display: inline-block;
  right: -5px;
  top: -5px;
}
.inputBlock .acBox .body .uploadLink {
  text-align: center;
}
.inputBlock .acBox .body .uploadLink a {
  color: #9fc2d4;
  font-weight: bold;
  text-decoration: underline;
}
.inputBlock .acBox .body .uploadNote {
  color: #c8c8c8;
  font-size: 0.7142857143em;
  position: absolute;
  left: 0.7143em;
  bottom: 0.7143em;
  text-align: left;
}
.acBox .body .lead {
  font-size: 1.1428571429em;
  font-weight: bold;
  letter-spacing: normal;
  text-align: center;
  line-height: 1.625;
}
.acBox .body .share {
  text-align: center;
  margin: 1.4285714286em 0 0;
}
.acBox .body .share .shareText {
  margin-bottom: 0.5714285714em;
}
.acBox .body .share .icons {
  line-height: 1;
  letter-spacing: -.4em;
}
.acBox .body .share .icons li {
  width: 2.2857142857em;
  display: inline-block;
  letter-spacing: normal;
  margin: 0 1.0714285714em;
}
.acBox .body .urlWrap {
  margin: 1.1428571429em 1.0714285714em 0;
}
.acBox .body .urlWrap textarea {
  font-size: 0.8571428571em;
  line-height: 1.6666666667;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 11.0416666667em;
  padding: 1.25em;
  border: #d6d6d6 1px solid;
  border-radius: 3px;
  outline: none;
}
.acBox .body .urlCopy {
  text-align: center;
  margin-top: 1.0714285714em;
}
.acBox .body .urlCopy a {
  color: #9fc2d4;
  font-weight: bold;
  text-decoration: underline;
}
.acBox .body .urlCopy a:hover {
  text-decoration: none;
}
.acBox .body .boadComp {
  margin: 1.2857142857em 0 1.1428571429em;
}
.acBox .body .boadComp .message {
  border: #d6d6d6 1px solid;
  border-radius: 3px;
  margin: 0 2.1428571429em;
  padding: 2.1428571429em 0;
}
.acBox .body .boadComp .message p {
  font-size: 1.1428571429em;
  line-height: 1.625;
  letter-spacing: normal;
}
.acBox .body .boadComp .message textarea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  font-size: 16px;
  letter-spacing: .08em;
  text-align: center;
  width: 100%;
  min-height: 46px;
  padding: 0 1.25em;
  outline: none;
}
.acBox .body .boadComp .note {
  font-size: 0.7142857143em;
  line-height: 1.8;
  text-align: center;
  margin-top: 1.5em;
}

/*/////////////////////////////
01. header
/////////////////////////////*/
.header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  background: #9fc2d4;
  padding: 20px 0 18px;
  z-index: 99;
}
.header.index {
  background-color: transparent;
  transition: background-color .4s ease;
}
.header.index.show {
  background-color: #9fc2d4;
}
.header.index.show .logo {
  opacity: 1;
  visibility: visible;
}
.header .wrap {
  max-width: 768px;
  margin: 0 auto;
}
.header .inner {
  padding: 0 1.0714285714em;
  position: relative;
}
.header .logo {
  width: 19.7142857143em;
  max-width: 276px;
  position: relative;
  z-index: 2;
}
.header .nav .navBtn {
  display: block;
  width: 30px;
  height: 0;
  padding-top: 30px;
  overflow: hidden;
  outline: none;
  position: absolute;
  top: 50%;
  right: 1.0714285714em;
  margin: -15px -4px 0 0;
  z-index: 2;
}
.header .nav .navBtn:before,
.header .nav .navBtn span:before,
.header .nav .navBtn span:after {
  content: "";
  display: block;
  width: 22px;
  height: 2px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  margin-left: -11px;
  will-change: transform;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  z-index: 1;
}
.header .nav .navBtn:before {
  top: 50%;
  margin-top: -1px;
}
.header .nav .navBtn span:before {
  top: 7px;
}
.header .nav .navBtn span:after {
  top: 21px;
}
.header .nav .navBtn.open:before {
  width: 0;
  opacity: 0;
}
.header .nav .navBtn.open span:before {
  top: 14px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.header .nav .navBtn.open span:after {
  top: 14px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.header .nav .navbody {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #9fc2d4;
  padding-top: 3.8571428571em;
  z-index: 1;
  display: none;
}
.header .nav .navbody .navInner {
  width: 100%;
  height: 100%;
  display: table;
}
.header .nav .navbody .navInner .cell {
  display: table-cell;
  vertical-align: middle;
}
.header .nav .navbody .navInner .cell .contena {
  color: #fff;
  text-align: center;
  max-width: 768px;
  margin: 0 auto;
}
.header .nav .navbody .login {
  width: 17.8571428571em;
  margin: 0 auto;
}
.header .nav .navbody .login + .login {
  margin-top: 1.4285714286em;
}
.header .nav .navbody .gnav {
  width: 12.5em;
  margin: 3.5714285714em auto 0;
  text-align: left;
}
.header .nav .navbody .gnav li {
  margin-bottom: 2em;
}
.header .nav .navbody .gnav li a {
  font-size: 1.1428571429em;
  display: block;
  position: relative;
}
.header .nav .navbody .gnav li a:after {
  content: "";
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 0.625em;
  height: 0.625em;
  display: inline-block;
  vertical-align: middle;
  border-right: #fff 3px solid;
  border-bottom: #fff 3px solid;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  top: 50%;
  right: 0.3125em;
  margin-top: -0.3125em;
}
.header .nav .navbody .gnav li a.newIcon:before {
  content: "";
  display: block;
  width: 1.875em;
  height: 0.75em;
  background: url("../images/new.svg") no-repeat;
  background-position: left top;
  background-size: contain;
  position: absolute;
  left: 0;
  bottom: 100%;
}
.header .nav .navbody .info {
  margin-top: 9.2857142857em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.header .nav .navbody .info li {
  width: 4.2857142857em;
  margin: 0 1.0714285714em;
}
.header .nav .navbody .info li a {
  display: block;
  font-size: 0.8571428571em;
  font-weight: bold;
  line-height: 1;
}
.header .nav .navbody .info li a:before {
  content: "";
  display: block;
  width: 100%;
  padding-top: 100%;
  margin-bottom: 0.8333333333em;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
.header .nav .navbody .info li a span {
  display: block;
}
.header .nav .navbody .info li a.i01:before {
  background-image: url("../images/icon01.svg");
}
.header .nav .navbody .info li a.i02:before {
  background-image: url("../images/icon02.svg");
}
.header .nav .navbody .info li a.i03:before {
  background-image: url("../images/icon03.svg");
}
.header .nav .navbody .other {
  margin: 2.1428571429em 0 0;
}
.header .nav .navbody .other ul {
  font-size: 0.8571428571em;
  line-height: 2.5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.header .nav .navbody .other ul li {
  margin: 0 1em;
}
.header .nav .navbody .other ul li a {
  text-decoration: underline;
}
.header .nav .navbody .other ul li a:hover {
  text-decoration: none;
}
.header.new .inner:after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #eb6877;
  border: #9fc2d4 1px solid;
  position: absolute;
  top: -0.6428571429em;
  right: 0.75em;
  z-index: 2;
}

/*/////////////////////////////
02. main
/////////////////////////////*/
.main {
  padding: 3.8571428571em 0 0;
  overflow: hidden;
}
.main.index {
  padding-top: 0;
}
.main .boardSect + .boardSect {
  margin-top: 3.0357142857em;
}
.main .boardSect .hdg {
  font-size: 1.5714285714em;
  line-height: 1.333;
  margin-bottom: 0.6818181818em;
}
.main .boardSect .title {
  font-size: 1.1428571429em;
  font-weight: bold;
  line-height: 1.333;
  letter-spacing: .12em;
  text-align: center;
  margin: 2.1875em 0 1.25em;
}
.main .boardSect .boardList {
  margin: 0 -1.0714285714em;
}
.main .boardSect .boardList ul li {
  border-bottom: #d6d6d6 1px solid;
}
.main .boardSect .boardList ul li:first-child {
  border-top: #d6d6d6 1px solid;
}
.main .boardSect .boardList ul li a {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  width: 100%;
  min-height: 69px;
  padding: 0.8571428571em 2.5em 0.7857142857em 1.0714285714em;
  position: relative;
}
.main .boardSect .boardList ul li a > span {
  display: table-cell;
  vertical-align: middle;
}
.main .boardSect .boardList ul li a .releaseIcon {
  display: block;
  color: #787878;
  font-size: 0.7142857143em;
  margin-bottom: 0.3em;
}
.main .boardSect .boardList ul li a .releaseIcon:before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: middle;
  margin-right: 0.3em;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  position: relative;
  top: -1px;
}
.main .boardSect .boardList ul li a .releaseIcon.release:before {
  background-image: url("../images/release-gl.svg");
}
.main .boardSect .boardList ul li a .releaseIcon.unRelease:before {
  background-image: url("../images/release_ltd-gl.svg");
}
.main .boardSect .boardList ul li a .releaseIcon.new:after {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 3em;
  height: 1.2em;
  background: url("../images/new.svg") no-repeat;
  background-position: left top;
  background-size: contain;
  margin-left: 0.6em;
}
.main .boardSect .boardList ul li a:after {
  content: "";
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 7px;
  height: 7px;
  border-right: #9fc2d4 2px solid;
  border-bottom: #9fc2d4 2px solid;
  position: absolute;
  top: 50%;
  right: 1.0714285714em;
  margin-top: -3.5px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.main .boardSect .boardList ul.icon li a {
  padding-left: 5em;
  background-repeat: no-repeat;
  background-position: 1.25em center;
  background-size: 2.5em auto;
}
.main .boardSect .boardList ul.icon li a.note {
  background-image: url("../images/note.svg");
}
.main .boardSect .boardList ul.icon li a.pen {
  background-image: url("../images/pen.svg");
}
.main .boardSect .qaList {
  margin: 0 -1.0714285714em;
}
.main .boardSect .qaList ul li {
  border-bottom: #d6d6d6 1px solid;
}
.main .boardSect .qaList ul li:first-child {
  border-top: #d6d6d6 1px solid;
}
.main .boardSect .qaList ul li > a {
  display: block;
  position: relative;
}
.main .boardSect .qaList ul li > a:before, .main .boardSect .qaList ul li > a:after {
  content: "";
  display: block;
  width: 0.7857142857em;
  height: 1px;
  background: #9fc2d4;
  position: absolute;
  top: 1.7142857143em;
  right: 1.0714285714em;
  transition: transform .4s ease;
}
.main .boardSect .qaList ul li > a:after {
  transform: rotate(90deg);
}
.main .boardSect .qaList ul li > a.open:after {
  transform: rotate(0);
}
.main .boardSect .qaList ul li > a .wrap {
  box-sizing: border-box;
  width: 100%;
  display: table;
  table-layout: fixed;
  padding: 0.6428571429em 2.5em 0.5714285714em 1.0714285714em;
}
.main .boardSect .qaList ul li > a .wrap > * {
  display: table-cell;
  vertical-align: top;
}
.main .boardSect .qaList ul li > a .q {
  width: 2.1428571429em;
}
.main .boardSect .qaList ul li > a .q span {
  color: #fff;
  font-size: 0.8571428571em;
  line-height: 2.5;
  letter-spacing: 0;
  text-align: center;
  background: #b4b4b4;
  display: block;
  border-radius: 50%;
}
.main .boardSect .qaList ul li > a .text {
  padding: 0.2142857143em 0 0.1428571429em 1.0714285714em;
}
.main .boardSect .qaList ul li .body {
  margin: 0 1.0714285714em;
  padding: 0.6428571429em 0 0.5714285714em;
  border-top: #d6d6d6 1px dashed;
  display: none;
}
.main .boardSect .qaList ul li .body .lyt {
  width: 100%;
  display: table;
  table-layout: fixed;
}
.main .boardSect .qaList ul li .body .lyt > * {
  display: table-cell;
  vertical-align: top;
}
.main .boardSect .qaList ul li .body .a {
  width: 2.1428571429em;
}
.main .boardSect .qaList ul li .body .a span {
  color: #b4b4b4;
  font-size: 0.8571428571em;
  line-height: 2.3333333333;
  letter-spacing: 0;
  text-align: center;
  border: #b4b4b4 1px solid;
  display: block;
  border-radius: 50%;
}
.main .boardSect .qaList ul li .body .text {
  padding: 0.2142857143em 0 0.1428571429em 1.0714285714em;
}
.main .boardSect .qaList ul li .body .text a {
  text-decoration: underline;
}
.main .boardSect .qaList ul li .body .text a:hover {
  text-decoration: none;
}
.main .boardSect .more {
  text-align: center;
  margin-top: 1.0714285714em;
}
.main .boardSect .more a {
  color: #9fc2d4;
  font-weight: bold;
}
.main .postList .heading {
  margin-bottom: 2.1428571429em;
}
.main .postList .heading .title {
  font-size: 1.5714285714em;
  line-height: 1.4545454545;
  margin-bottom: 1.2727272727em;
}
.main .postList .heading .share {
  text-align: center;
  margin: 0 0 1.4285714286em;
}
.main .postList .heading .share .shareText {
  font-size: 0.8571428571em;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 1em;
}
.main .postList .heading .share .icons {
  line-height: 1;
  letter-spacing: -.4em;
}
.main .postList .heading .share .icons li {
  width: 2.2857142857em;
  display: inline-block;
  letter-spacing: normal;
  margin: 0 0.7142857143em;
}
.main .postList .heading .urlWrap {
  margin-bottom: 1.4285714286em;
}
.main .postList .heading .urlWrap input {
  font-size: 0.8571428571em;
  line-height: 2.5;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 2.5em;
  padding: 0 0.8333333333em;
  border: #9fc2d4 1px solid;
  border-radius: 3px;
  outline: none;
}
.main .postList .heading .urlCopy {
  text-align: center;
}
.main .postList .heading .urlCopy a {
  font-size: 0.8571428571em;
  text-decoration: underline;
}
.main .postList .heading .urlCopy a:hover {
  text-decoration: none;
}
.main .postList .notice {
  font-size: 0.8571428571em;
  text-align: center;
  margin-bottom: 1.25em;
}
.main .postList .body .col {
  position: relative;
}
.main .postList .body .col + .col {
  margin-top: 0.7142857143em;
}
.main .postList .body .col.c1 .inner {
  border: #ededec 1px solid;
  background-color: #fff;
}
.main .postList .body .col.c2 .inner {
  background-color: #ededec;
}
.main .postList .body .col.c3 .inner {
  background-color: #efb7b6;
}
.main .postList .body .col.c4 .inner {
  background-color: #93c7d0;
}
.main .postList .body .col.c5 .inner {
  background-color: #f7d36b;
}
.main .postList .body .col.img .inner {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.main .postList .body .col.img .name a,
.main .postList .body .col.img .name p span {
  color: #fff;
  text-shadow: 1px 0 0 #9fc2d4, -1px 0 0 #9fc2d4, 0 1px 0 #9fc2d4, 0 -1px 0 #9fc2d4, 0 1px #9fc2d4, 0 -1px 0 #9fc2d4, 1px 0 0 #9fc2d4, -1px 0 0 #9fc2d4;
}
.main .postList .body .col .inner {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  width: 100%;
  height: 100%;
  border-radius: 6px;
}
.main .postList .body .col .inner:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
  min-height: 24.6428571429em;
}
.main .postList .body .col .inner .message {
  font-size: 1.4285714286em;
  line-height: 1.6;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  padding: 4.2857142857em 1.0714285714em;
}
.main .postList .body .col .inner .message.l {
  font-size: 2.2857142857em;
  line-height: 1.3333333333;
}
.main .postList .body .col .inner .message.s {
  font-size: 1em;
  line-height: 1.7142857143;
}
.main .postList .body .col .name {
  text-align: center;
  position: absolute;
  right: 0;
  bottom: 1.2857142857em;
  left: 0;
}
.main .postList .body .col .name a {
  display: inline-block;
  text-decoration: underline;
}
.main .postList .body .col .name a:hover {
  text-decoration: none;
}
.main .postList .body .col .name p span {
  color: #787878;
  font-size: 0.8571428571em;
  line-height: 1.6666666667;
  display: block;
}
.main .postList .body .col .delete {
  background-image: url("../images/close.png");
  background-size: 22px 22px;
  background-position: center;
  background-repeat: no-repeat;
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 22px;
  height: 22px;
  padding-top: 21px;
  overflow: hidden;
  position: absolute;
  top: 0.6428571429em;
  right: 0.6428571429em;
  /* border: #9fc2d4 2px solid; */
  outline: none;
  border-radius: 50%;
}
/* .main .postList .body .col .delete:before, .main .postList .body .col .delete:after {
  content: "";
  display: block;
  width: 12px;
  height: 2px;
  background: #464646;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -1px 0 0 -6px;
}
.main .postList .body .col .delete:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.main .postList .body .col .delete:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
} */

/*/////////////////////////////
03. modal
/////////////////////////////*/
.modal {
  text-align: center;
  width: 86.6666666667%;
  max-width: 650px;
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: #9fc2d4;
  border-radius: 6px;
  z-index: 101;
  display: none;
}
.modal.fullSize {
  width: calc(100% - 2.1428571428em);
  max-width: 708px;
}
.modal .inner {
  padding: 3.5714285714em 1.0714285714em;
}
.modal .lead {
  color: #fff;
  font-size: 1.4285714286em;
  font-weight: bold;
  line-height: 1.333;
  text-align: center;
  margin-bottom: 1.5em;
}
.modal .lead img {
  display: inline;
  margin-bottom: 0.3em;
}
.modal.modal--icon .lead {
  margin-bottom: 0.5em;
}
.modal.modal--icon .text {
  margin-bottom: 1em;
}
.modal .inner1 .lead {
  background: #9fc2d4;
  color: #fff;
  font-weight: bold;
  line-height: 3.5;
  text-align: center;
  font-size: 100%;
  margin-bottom: 0;
  border-radius: 6px 6px 0 0;
}
.modal .text {
  color: #fff;
  line-height: 1.5714285714;
  text-align: center;
  margin-bottom: 2.8571428571em;
}
.modal .trimmingArea {
  text-align: center;
  background: #fff;
  border: #9fc2d4 1px solid;
  overflow: hidden;
  padding: 1.5em;
}
.modal .trimmingArea.area--sq {
  padding: 1.5em;
}
.modal .trimmingArea .frame {
  border: #9fc2d4 5px solid;
  margin: 0 auto;
  width: calc(100vw - 5.1428571428em - 12px);
  max-width: calc(708px - 3em - 12px);
  height: calc((100vw - 5.1428571428em - 12px) * 0.52356);
  max-height: calc((708px - 3em - 12px) * 0.52356);
}
.modal .trimmingArea.area--sq .frame {
  width: calc(100vw - 5.1428571428em - 12px);
  max-width: calc(708px - 27em - 12px);
  height: calc(100vw - 5.1428571428em - 12px);
  max-height: calc(708px - 27em - 12px);
}
.modal#trimmingModal #controls {
  background: #fff;
  border: #9fc2d4 1px solid;
  border-top: 0 none;
  text-align: center;
  padding: 1.5em 0;
}
.modal#trimmingModal #controls a {
  width: 20px;
  height: 20px;
  display: inline-block;
  vertical-align: middle;
}
#slider .ui-slider-handle {
  outline: 0;
  background: #9fc2d4;
  border-radius: 50%;
  border: 0 none;
  top: -.45em;
}
#slider.ui-slider-horizontal {
  height: .3em;
  width: 50%;
  border: none;
  background: #9fc2d4;
  display: inline-block;
  vertical-align: middle;
  margin: 0 20px;
}
.modal .thanks {
  width: 9.7857142857em;
  margin: 0 auto 2.8571428571em;
}
.modal .noticeText {
  color: #fff;
  font-weight: bold;
  text-align: center;
  margin-bottom: 2.8571428571em;
}
.modal .modalBtn {
  width: 84.7457627119%;
  max-width: 250px;
  margin: 0 auto;
}
.modal .inner1 .modalBtn {
  padding: 1.5em 0;
}
.modal .modalBtn + .modalBtn {
  margin-top: 1.0714285714em;
}
.modal .modalBtn .btn {
  width: 100%;
  color: #9fc2d4;
  font-weight: bold;
  letter-spacing: .08em;
  line-height: 3.5714285714;
  display: block;
  background: #fff;
  border-radius: 1.7857142857em;
  outline: none;
  cursor: pointer;
}
.modal .share {
  margin: 1.6428571429em 0 1.4285714286em;
}
.modal .share .shareText {
  color: #fff;
  font-size: 0.8571428571em;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 1em;
}
.modal .share .icons {
  line-height: 1;
  letter-spacing: -.4em;
}
.modal .share .icons li {
  width: 2.2857142857em;
  display: inline-block;
  letter-spacing: normal;
  margin: 0 0.7142857143em;
}
.modal .urlWrap {
  margin: 1.4285714286em 0;
}
.modal .urlWrap input {
  color: #fff;
  font-size: 0.8571428571em;
  line-height: 2.5;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%;
  height: 2.5em;
  padding: 0 0.8333333333em;
  border: #fff 1px solid;
  border-radius: 3px;
  outline: none;
}
.modal .urlCopy a {
  color: #fff;
  font-size: 0.8571428571em;
  text-decoration: underline;
}
.modal .urlCopy a:hover {
  text-decoration: none;
}

#overlay {
  background: rgba(255, 255, 255, 0.7);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  display: none;
}

#overlayblk {
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  display: none;
}

/*/////////////////////////////
04. aboutBlock
/////////////////////////////*/
.aboutBlock {
  background: #fff;
  padding-top: 4.2857142857em;
}
.aboutBlock .heading {
  padding-bottom: 2.0714285714em;
  margin-bottom: 2.0714285714em;
  position: relative;
}
.aboutBlock .heading:after {
  content: "";
  display: block;
  width: 3.2142857143em;
  height: 1px;
  background: #93c7d0;
  position: absolute;
  left: 50%;
  bottom: 0;
  margin-left: -1.6071428571em;
}
.aboutBlock .heading .logo {
  width: 17.8571428571em;
  margin: 0 auto 3.3571428571em;
}
.aboutBlock .heading .catch {
  width: 14.5714285714em;
  margin: 0 auto;
}
.aboutBlock .body .text {
  line-height: 1.8461538462;
  text-align: center;
}
.aboutBlock .body .text + .text {
  margin-top: 1.5em;
}
.aboutBlock .foot {
  text-align: center;
  margin-top: 3.5714285714em;
}
.aboutBlock .foot .box {
  background: #9fc2d4;
  border-radius: 6px;
  padding: 2.1428571429em 0 2.5714285714em;
}
.aboutBlock .foot .box .link li {
  width: 17.8571428571em;
  margin: 0 auto 1.4285714286em;
}
.aboutBlock .foot .box .service {
  margin-top: 2.1428571429em;
}
.aboutBlock .foot .box .service a {
  color: #fff;
  font-weight: bold;
  display: inline-block;
}
.aboutBlock .foot .box .service a:after {
  content: "";
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 0.5em;
  height: 0.5em;
  display: inline-block;
  vertical-align: middle;
  border-right: #fff 2px solid;
  border-bottom: #fff 2px solid;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  margin-left: 0.7142857143em;
}
.aboutBlock .cnvBlock {
  margin-top: 3.5714285714em;
}

/*/////////////////////////////
05. indexblock
/////////////////////////////*/
.indexblock {
  background: #fff;
  padding-bottom: 3.2142857143em;
}
.indexblock .indexhdg02 {
  text-align: center;
  margin-bottom: 1.7857142857em;
}
.indexblock .indexhdg02 span {
  display: block;
}
.indexblock .indexhdg02 .ja {
  font-size: 1.5714285714em;
  font-weight: bold;
  letter-spacing: .12em;
  line-height: 1.3636363636;
}
.indexblock .indexhdg02 .en {
  color: #9fc2d4;
  font-weight: bold;
  line-height: 2;
  letter-spacing: .02em;
}
.indexblock .heading {
  padding: 4.2857142857em 0 2.5em;
  background: #9fc2d4;
}
.indexblock .heading .mv {
  max-width: 600px;
  margin: 0 auto;
}
.indexblock .heading .links {
  margin-top: 2.8571428571em;
}
.indexblock .heading .links .btn {
  width: 17.8571428571em;
  margin: 0 auto 1.4285714286em;
}
.indexblock .heading .links .btn a {
  line-height: 3.5714285714em;
  border: none;
  border-radius: 1.7857142857em;
}
.indexblock .heading .links .link {
  text-align: center;
}
.indexblock .heading .links .link a {
  color: #fff;
  font-weight: bold;
  display: inline-block;
}
.indexblock .heading .links .link a:after {
  content: "";
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 0.5em;
  height: 0.5em;
  display: inline-block;
  vertical-align: middle;
  border-right: #fff 2px solid;
  border-bottom: #fff 2px solid;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  margin-left: 0.7142857143em;
  position: relative;
  top: -1px;
}
.indexblock .sectHowto {
  padding: 3.2142857143em 0 0;
}
.indexblock .sectHowto .lead {
  width: 15.3571428571em;
  margin: 2.1428571429em auto 3.8571428571em;
}
.indexblock .sectHowto .lyt {
  margin-top: 2.1428571429em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.indexblock .sectHowto .lyt .col {
  text-align: center;
  width: 47.8260869565%;
  margin-bottom: 3.4285714286em;
}
.indexblock .sectHowto .lyt .col .box {
  border: #9fc2d4 1px solid;
  border-radius: 6px;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: auto 7.7142857143em;
  position: relative;
}
.indexblock .sectHowto .lyt .col .box:before {
  content: "";
  display: block;
  padding-top: 13.5714285714em;
}
.indexblock .sectHowto .lyt .col .box .num {
  width: 2.8571428571em;
  position: absolute;
  top: 0;
  left: 50%;
  margin: -1.4285714286em 0 0 -1.4285714286em;
}
.indexblock .sectHowto .lyt .col .box .inner {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  padding-top: 2.1428571429em;
}
.indexblock .sectHowto .lyt .col .box .inner p {
  color: #9fc2d4;
  font-size: 1.1428571429em;
  font-weight: bold;
  line-height: 1.5714285714;
}
.indexblock .sectHowto .lyt .col.col1 .box {
  background-image: url("../images/top_image01.png");
}
.indexblock .sectHowto .lyt .col.col2 .box {
  background-image: url("../images/top_image02.png");
}
.indexblock .sectHowto .lyt .col.col3 .box {
  background-image: url("../images/top_image03.png");
}
.indexblock .sectHowto .lyt .col.col4 .box {
  background-image: url("../images/top_image04.png");
}
.indexblock .sectHowto .lyt .col.col5 {
  width: 100%;
  margin-bottom: 0;
}
.indexblock .sectHowto .lyt .col.col5 .box {
  background-image: url("../images/top_image05.png");
  background-size: auto 9.9285714286em;
}
.indexblock .sectHowto .lyt .col .text {
  font-size: 0.8571428571em;
  line-height: 1.5384615385;
  margin-top: 0.7692307692em;
}
.indexblock .sectWhento {
  padding: 4.6428571429em 0 5em;
}
.indexblock .sectWhento .section {
  margin-top: 3.4285714286em;
}
.indexblock .sectWhento .section + .section {
  margin-top: 2.8571428571em;
}
.indexblock .sectWhento .section .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
.indexblock .sectWhento .section .inner .col {
  width: 50.6666666667%;
  position: relative;
  z-index: 1;
}
.indexblock .sectWhento .section .inner .col.narrow .in {
  padding: 1.7857142857em 7.8947368421% 1.4285714286em 18.4210526316%;
}
.indexblock .sectWhento .section .inner .col .in {
  background: #9fc2d4;
  margin-left: -10.5263157895%;
  padding: 2.8571428571em 7.8947368421% 2.5em 18.4210526316%;
  border-radius: 6px 0 0 6px;
}
.indexblock .sectWhento .section .inner .col h3 {
  color: #fff;
  font-weight: bold;
  line-height: 1.4285714286;
  margin-bottom: 0.7142857143em;
}
.indexblock .sectWhento .section .inner .col p {
  font-size: 0.8571428571em;
  line-height: 1.6666666667;
}
.indexblock .sectWhento .section .inner .image {
  box-sizing: border-box;
  width: 49.3333333333%;
  padding-left: 4%;
  position: relative;
  z-index: 2;
}
.indexblock .sectWhento .section .inner .image span {
  display: block;
  overflow: hidden;
  background: #fff;
  border: #9fc2d4 1px solid;
  border-radius: 6px;
  margin-top: -1.4285714286em;
}
.indexblock .sectWhento .section .inner .image span img {
  margin: 0 auto;
}
.indexblock .sectWhento .section.rev .inner {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}
.indexblock .sectWhento .section.rev .inner .col .in {
  margin: 0 -10.5263157895% 0 0;
  padding: 2.8571428571em 18.4210526316% 2.5em 7.8947368421%;
  border-radius: 0 6px 6px 0;
}
.indexblock .sectWhento .section.rev .inner .image {
  padding: 0 4% 0 0;
}
.indexblock .sectWhento .section.rev .inner .image span {
  border-radius: 6px;
}
.indexblock .sectWhento .toboard {
  width: 17.8571428571em;
  margin: 5em auto 0;
}
.indexblock .sectVoice {
  padding: 0 0 3.5714285714em;
}
.indexblock .sectVoice .block {
  display: flex;
  align-items: flex-start;
}
.indexblock .sectVoice .block + .block {
  margin-top: 1.4285714286em;
}
.indexblock .sectVoice .block:nth-child(odd) {
  flex-direction: row-reverse;
}
.indexblock .sectVoice .block:nth-child(odd) .col {
  padding: 0 1.7857142857em 0 0;
}
.indexblock .sectVoice .block:nth-child(odd) .col .blln:before, .indexblock .sectVoice .block:nth-child(odd) .col .blln:after {
  right: auto;
  left: 100%;
}
.indexblock .sectVoice .block:nth-child(odd) .col .blln:before {
  border-width: 0.5714285714em 0 0.5714285714em 1.1428571429em;
  border-color: transparent transparent transparent #9fc2d4;
}
.indexblock .sectVoice .block:nth-child(odd) .col .blln:after {
  border-width: 0.5em 0 0.5em 0.9642857143em;
  border-color: transparent transparent transparent #fff;
}
.indexblock .sectVoice .block .fig {
  width: 5.7142857143em;
}
.indexblock .sectVoice .block .fig .img {
  border: #9fc2d4 1px solid;
  border-radius: 50%;
  overflow: hidden;
}
.indexblock .sectVoice .block .fig .name {
  font-size: 0.8571428571em;
  font-weight: bold;
  letter-spacing: .02em;
  line-height: 1;
  text-align: center;
  margin-top: 0.4166666667em;
}
.indexblock .sectVoice .block .col {
  flex: 1;
  padding-left: 1.7857142857em;
}
.indexblock .sectVoice .block .col .blln {
  border: #9fc2d4 1px solid;
  padding: 1.4285714286em;
  border-radius: 6px;
  position: relative;
}
.indexblock .sectVoice .block .col .blln:before, .indexblock .sectVoice .block .col .blln:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  position: absolute;
  right: 100%;
}
.indexblock .sectVoice .block .col .blln:before {
  top: 1.9285714286em;
  border-width: 0.5714285714em 1.1428571429em 0.5714285714em 0;
  border-color: transparent #9fc2d4 transparent transparent;
}
.indexblock .sectVoice .block .col .blln:after {
  top: 2em;
  border-width: 0.5em 0.9642857143em 0.5em 0;
  border-color: transparent #fff transparent transparent;
}
.indexblock .sectVoice .block .col .blln p {
  font-size: 0.8571428571em;
  letter-spacing: .08em;
  line-height: 1.6666666667;
}

/*/////////////////////////////
06. otherBlock
/////////////////////////////*/
.otherBlock {
  background: #fff;
  padding: 2.8571428571em 0 3.2142857143em;
}
.otherBlock .hdg {
  color: #9fc2d4;
  font-size: 1.5714285714em;
  font-weight: bold;
  letter-spacing: .07em;
  line-height: 1.2;
  text-align: center;
  margin-bottom: 1.1363636364em;
}
.otherBlock .block {
  padding-bottom: 1.4285714286em;
  border-bottom: #9fc2d4 1px dashed;
}
.otherBlock .block + .block {
  margin-top: 1.4285714286em;
}
.otherBlock .block h3 {
  margin-bottom: 1.0714285714em;
}
.otherBlock .block .text {
  font-size: 0.8571428571em;
  line-height: 1.6666666667;
  letter-spacing: .05em;
}
.otherBlock .block .list {
  margin-top: 0.8333333333em;
  font-size: 0.8571428571em;
  line-height: 1.6666666667;
}
.otherBlock .block .list.mt0 > li + li {
  margin-top: 0;
}
.otherBlock .block .list > li {
  display: table;
}
.otherBlock .block .list > li > * {
  display: table-cell;
  vertical-align: top;
}
.otherBlock .block .list > li > .fig {
  width: 2.8333333333em;
}
.otherBlock .block .list > li + li {
  margin-top: 1.25em;
}
.otherBlock .block .list > li .list {
  font-size: 1em;
}
.otherBlock .block .list .inList {
  font-size: 1em;
  line-height: 1.6666666667;
}
.otherBlock .block .list .inList > li {
  text-indent: -1em;
  padding-left: 1em;
  margin-top: 0.8333333333em;
}
.otherBlock .block .list .inList > li .list {
  margin-top: 0;
  text-indent: 0;
}
.otherBlock .block .list .inList > li .list > li > .fig {
  width: 2em;
}
.otherBlock .block .list .figList {
  font-size: 1em;
  line-height: 1.6666666667;
  text-indent: 0;
}
.otherBlock .block .list .figList > li {
  display: table;
}
.otherBlock .block .list .figList > li > * {
  display: table-cell;
  vertical-align: top;
}
.otherBlock .block .list .figList > li > .fig {
  white-space: nowrap;
}

/*/////////////////////////////
07. loginBlock
/////////////////////////////*/
.loginBlock {
  width: 100%;
  max-width: 420px;
  height: calc(100vh - 3.8571428571em - 5px - 1.4285714286em);
  display: table;
  margin: 0 auto;
}
.loginBlock .inner {
  display: table-cell;
  vertical-align: middle;
  padding: 0 2.1428571429em;
}
.loginBlock .logo {
  width: 12.1428571429em;
  margin: 0 auto 4.2857142857em;
}
.loginBlock .loginBtn li {
  margin-top: 1.4285714286em;
}
.loginBlock .loginBtn li:first-child {
  margin-top: 0;
}
.loginBlock .loginBtn li a {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  color: #9fc2d4;
  font-weight: bold;
  letter-spacing: .08em;
  text-align: center;
  line-height: 4.2857142857em;
  background: #fff;
  border-radius: 2.1428571429em;
}
.loginBlock .loginBtn li a:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 1.6428571429em;
  height: 1.6428571429em;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  margin-right: 0.7142857143em;
  position: relative;
  top: -2px;
}
.loginBlock .loginBtn li a.tw:before {
  background-image: url("../images/icon_tw.svg");
}
.loginBlock .loginBtn li a.fb:before {
  background-image: url("../images/icon_fb.svg");
}

/*/////////////////////////////
08. footer
/////////////////////////////*/
.footer {
  background: #9fc2d4;
  padding: 2.1428571429em 0 1.9642857143em;
}
.footer .inner {
  max-width: 768px;
  margin: 0 auto;
}
.footer .logo {
  width: 10.7142857143em;
  margin: 0 auto;
}
.footer .sns {
  margin-top: 1.9285714286em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer .sns li {
  width: 2.1428571429em;
  margin: 0 0.7142857143em;
}
.footer .sns li a {
  display: block;
}
.footer .links {
  margin-top: 2.1428571429em;
  letter-spacing: -.4em;
  text-align: center;
}
.footer .links li {
  display: inline-block;
  letter-spacing: .08em;
  vertical-align: middle;
  margin: 0 0.8571428571em 0.4285714286em;
}
.footer .links li a {
  color: #fff;
  font-size: 0.8571428571em;
  display: block;
  text-decoration: underline;
}
.footer .links li a:hover {
  text-decoration: none;
}
.footer .copy {
  color: #fff;
  font-size: 0.7142857143em;
  text-align: center;
  margin-top: 1.75em;
}

/*/////////////////////////////
 RWD
/////////////////////////////*/
@media (min-width: 769px) {
  .header.index .logo {
    width: 34.2857142857em;
    max-width: 480px;
  }

  .header.new .inner:after {
    top: -0.1785714286em;
  }

  .indexblock .heading {
    padding-top: 72px;
  }

  .indexblock .heading .links {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
  }
  .indexblock .heading .links .btn {
    margin: 0 1.0714285714em 2.1428571429em;
  }
  .indexblock .heading .links .link {
    width: 100%;
  }

  .main .postList .body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
  .main .postList .body .col {
    width: 49.1869918699%;
    margin-bottom: 0.7142857143em;
  }
  .main .postList .body .col + .col {
    margin-top: 0;
  }
  .main .postList .body .col .inner:before {
    min-height: 25.9285714286em;
  }

  .main .completeSubmit .heading a {
    text-align: center;
    padding: 0.875em 0 0.5625em;
  }

  .indexblock .sectWhento .section .inner {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .indexblock .sectWhento .section .inner .image span {
    border-left: #9fc2d4 1px solid;
    border-radius: 6px;
  }

  .indexblock .sectWhento .section.rev .inner .image span {
    border-right: #9fc2d4 1px solid;
    border-radius: 6px;
  }
}

/*# sourceMappingURL=base.css.map */