@charset "UTF-8";
/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Change the default font family in all browsers (opinionated).
 * 2. Correct the line height in all browsers.
 * 3. Prevent adjustments of font size after orientation changes in IE and iOS.
 */
html {
  font-family: sans-serif; /* 1 */
  line-height: 1.15; /* 2 */
  -ms-text-size-adjust: 100%; /* 3 */
  -webkit-text-size-adjust: 100%; /* 3 */
}

/**
 * Remove the margin in all browsers (opinionated).
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 * 2. Add the correct display in IE.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary { /* 1 */
  display: block;
}

/**
 * Add the correct display in IE 9-.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Add the correct display in IE 10-.
 * 1. Add the correct display in IE.
 */
template,
[hidden] {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
  background-color: transparent; /* 1 */
  -webkit-text-decoration-skip: objects; /* 2 */
}

/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */
a:active,
a:hover {
  outline-width: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
  font-style: italic;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Add the correct background and color in IE 9-.
 */
mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10-.
 */
img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct margin in IE 8.
 */
figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/* Forms
   ========================================================================== */
/**
 * 1. Change font properties to `inherit` in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font: inherit; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Restore the font weight unset by the previous rule.
 */
optgroup {
  font-weight: bold;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select { /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button,
html [type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button; /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
 */
[type=search]::-webkit-search-cancel-button,
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Correct the text style of placeholders in Chrome, Edge, and Safari.
 */
::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.54;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*****************************************
 変数
*****************************************/
/*****************************************
 全体（ベース）
*****************************************/
html {
  margin: 0;
  padding: 0;
}

body {
  margin: 0;
  padding: 0;
  font-family: "Lucida Grande", "Hiragino Kaku Gothic ProN", "\30D2\30E9\30AE\30CE\89D2\30B4   ProN W3", "Meiryo", "\30E1\30A4\30EA\30AA", sans-serif;
  text-align: center;
  background-color: #E2E2E2;
  color: #000;
  word-break: break-all;
  /* 英単語を改行 word-wrapだと効かない*/
}

p {
  margin: 0 10px 10px;
}

a {
  text-decoration: none;
  color: #0099FF;
}
a:hover {
  text-decoration: underline;
  color: #0099FF;
}
a:active, a:visited {
  text-decoration: none;
  color: #0099FF;
}

h2, ul, dl, dt, dd {
  margin: 0;
  padding: 0;
}

li {
  list-style-type: none;
}

button {
  border: none;
}

/* IE */
textarea:-ms-input-placeholder,
input:-ms-input-placeholder {
  color: #CCC !important;
}

.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px solid #CCC;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}

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

.d-block {
  display: block !important;
}

.d-flex {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.border-b {
  border-bottom: 1px solid #E2E2E2;
}

.f_l {
  float: left;
}

.f_r {
  float: right;
}

.cl_l {
  clear: left;
}

.cl_r {
  clear: right;
}

.mt-10 {
  margin-top: 10px;
}

.mt-20 {
  margin-top: 20px;
}

.mt-30 {
  margin-top: 30px;
}

.mb-10 {
  margin-bottom: 10px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-30 {
  margin-bottom: 30px;
}

.pl-0 {
  padding-left: 0 !important;
}

.f-basis-10 {
  flex-basis: 10%;
}

.f-basis-20 {
  flex-basis: 20%;
}

.f-basis-30 {
  flex-basis: 30%;
}

.f-basis-40 {
  flex-basis: 40%;
}

.f-basis-50 {
  flex-basis: 50%;
}

.text_left {
  text-align: left;
}

.text_right {
  text-align: right;
}

.text_center {
  text-align: center;
}

.red {
  color: #F00;
}

.pre_wrap {
  white-space: pre-wrap;
}

.row {
  clear: both;
  margin-top: 10px;
  margin-bottom: 10px;
}

[v-cloak] {
  display: none;
}

.pointer {
  cursor: pointer;
}

/*****************************************
 LazyLoad
*****************************************/
.lazy {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 100%;
  height: 100%;
}

img[lazy=loading] {
  width: 40% !important;
}
img[lazy=loaded] {
  background-size: cover;
  animation-duration: 1s;
  animation-fill-mode: both;
  animation-name: fadeIn;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*****************************************
 Pagination
*****************************************/
ul.pagination {
  text-align: center;
  font-size: 0;
}
ul.pagination li {
  display: inline-block;
  width: 40px;
  padding: 12px 0;
  background-color: #fff;
  font-size: 14px;
}
ul.pagination li:first-of-type {
  border-radius: 6px 0 0 6px;
}
ul.pagination li:last-of-type {
  border-radius: 0 6px 6px 0;
}

/*****************************************
 全体（ベース）
*****************************************/
body {
  font-size: 12px;
}

.hover_opacity:hover {
  opacity: 0.7;
}

/*****************************************
 フラッシュメッセージ
*****************************************/
.flash_message {
  border-radius: 3px;
  margin: 4px 0 20px 0;
  padding: 12px;
  color: #333;
}
.flash_message.primary {
  background-color: #d8e9f0;
  border: 1px solid #0088cc;
  color: #154457;
}
.flash_message.success {
  background-color: #dff0d8;
  border: 1px solid #66cc00;
  color: #155724;
}
.flash_message.danger {
  background-color: #f0d8d8;
  border: 1px solid #cc0000;
  color: #571515;
}
.flash_message.warning {
  background-color: #f0edd8;
  border: 1px solid #ccbe00;
  color: #555715;
}

/*****************************************
 Scroll Up
*****************************************/
.scroll_up {
  display: none;
  z-index: 9999;
  position: fixed;
  bottom: 110px;
  right: 10px;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background-color: #333;
  font-size: 36px;
  color: #fff;
  text-align: center;
  line-height: 40px;
  opacity: 0.8;
  cursor: pointer;
}

/*****************************************
 アイコンバッジ
*****************************************/
.icon_badge {
  display: block;
  position: absolute;
  z-index: 100;
  background-color: #ff0000;
  overflow: visible;
  border-radius: 50%;
  border: 1px solid #fff;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  font-size: 10px;
  color: #fff;
}

/*****************************************
 アラート
*****************************************/
.notice {
  border-radius: 6px;
  margin-bottom: 16px;
  padding: 8px;
  height: inherit;
  line-height: 16px;
  color: #333;
}
.notice.notice-success {
  background-color: #dff0d8;
  border: 1px solid #66cc00;
}
.notice.notice-warning {
  background-color: #fdf5da;
  border: 1px solid #ffe594;
}
.notice.notice-alert {
  background-color: #f8d7da;
  border: 1px solid #f5c6cb;
}
.notice.short {
  box-sizing: border-box;
  width: 640px;
}

/*****************************************
 エラー
*****************************************/
.error {
  background-color: #f8d7da;
  border: 1px solid #f5c6cb;
  border-radius: 3px;
  padding: 10px;
  line-height: 16px;
  color: #721c24;
  text-align: left;
}
.error ul li:not(:last-child) {
  margin-bottom: 2px;
}

/*****************************************
 コンテナ
*****************************************/
div.container {
  text-align: left;
  margin: auto;
  /*width: 1136px;*/
  width: 996px;
}

.wrapper {
  padding-top: 20px;
}

/*****************************************
 コンテンツ
*****************************************/
div.content {
  width: 640px;
  float: left;
  margin-bottom: 20px;
  border-radius: 5px;
  box-sizing: border-box;
}
div.content .inner h2 {
  font-size: 30px;
  font-weight: normal;
  line-height: 32px;
  margin: 0 0 20px 0;
}

.content.top_list {
  width: 660px;
}

div.right_column {
  float: right;
  width: 336px;
}
div.right_column .ad {
  margin-bottom: 20px;
}

img {
  vertical-align: bottom;
}

/*画像の下の隙間を無くす*/
table {
  width: 100%;
  border-collapse: collapse;
  border: 0;
}
table td {
  padding: 0;
}

.pg_title {
  font-size: 22px;
  font-weight: normal;
  line-height: 24px;
  margin: 0 0 10px 0;
}

.highlight:hover {
  opacity: 0.8;
}

/*****************************************
 お気に入り
*****************************************/
ul.favorite_type {
  padding-bottom: 10px;
  list-style-type: none;
  display: inline;
  font-size: 0;
  float: left;
}
ul.favorite_type li {
  font-size: 12px;
  display: inline-block;
  color: #CCCCCC;
}
ul.favorite_type li + li:before {
  content: "|";
  margin: 0 6px;
  font-size: 14px;
}
ul.favorite_type li.current {
  font-size: 22px;
}
ul.favorite_type li a {
  color: #4D4D4D;
}

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */
.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeIn {
  animation-name: fadeIn;
}
@keyframes fadeInRightBig {
  from {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.fadeInRightBig {
  animation-name: fadeInRightBig;
}
@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}
.fadeOutRightBig {
  animation-name: fadeOutRightBig;
}

/*****************************************
 アラート
*****************************************/
body.swal2-shown {
  overflow-y: hidden;
}
body.swal2-iosfix {
  position: fixed;
  left: 0;
  right: 0;
}

.swal2-container {
  display: flex;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  padding: 10px;
  background-color: transparent;
  z-index: 8500;
}
.swal2-container.swal2-fade {
  transition: background-color 0.1s;
}
.swal2-container.swal2-shown {
  background-color: rgba(0, 0, 0, 0.4);
}

.swal2-modal {
  background-color: #fff;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  border-radius: 5px;
  box-sizing: border-box;
  text-align: center;
  margin: auto;
  overflow-x: hidden;
  overflow-y: auto;
  display: none;
  position: relative;
  max-width: 100%;
}
.swal2-modal:focus {
  outline: none;
}
.swal2-modal.swal2-loading {
  overflow-y: hidden;
}
.swal2-modal .swal2-title {
  color: #595959;
  font-size: 30px;
  text-align: center;
  font-weight: 600;
  text-transform: none;
  position: relative;
  margin: 0 0 0.4em;
  padding: 0;
  display: block;
  word-wrap: break-word;
}
.swal2-modal .swal2-buttonswrapper {
  margin-top: 15px;
}
.swal2-modal .swal2-buttonswrapper:not(.swal2-loading) .swal2-styled[disabled] {
  opacity: 0.4;
  cursor: no-drop;
}
.swal2-modal .swal2-buttonswrapper.swal2-loading .swal2-styled.swal2-confirm {
  box-sizing: border-box;
  border: 4px solid transparent;
  border-color: transparent;
  width: 40px;
  height: 40px;
  padding: 0;
  margin: 7.5px;
  vertical-align: top;
  background-color: transparent !important;
  color: transparent;
  cursor: default;
  border-radius: 100%;
  animation: rotate-loading 1.5s linear 0s infinite normal;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.swal2-modal .swal2-buttonswrapper.swal2-loading .swal2-styled.swal2-cancel {
  margin-left: 30px;
  margin-right: 30px;
}
.swal2-modal .swal2-buttonswrapper.swal2-loading :not(.swal2-styled).swal2-confirm::after {
  display: inline-block;
  content: "";
  margin-left: 5px 0 15px;
  vertical-align: -1px;
  height: 15px;
  width: 15px;
  border: 3px solid #999999;
  box-shadow: 1px 1px 1px #fff;
  border-right-color: transparent;
  border-radius: 50%;
  animation: rotate-loading 1.5s linear 0s infinite normal;
}
.swal2-modal .swal2-styled {
  border: 0;
  border-radius: 3px;
  box-shadow: none;
  color: #fff;
  cursor: pointer;
  font-size: 17px;
  font-weight: 500;
  margin: 15px 5px 0;
  padding: 10px 32px;
}
.swal2-modal .swal2-image {
  margin: 20px auto;
  max-width: 100%;
}
.swal2-modal .swal2-close {
  background: transparent;
  border: 0;
  margin: 0;
  padding: 0;
  width: 38px;
  height: 40px;
  font-size: 36px;
  line-height: 40px;
  font-family: serif;
  position: absolute;
  top: 5px;
  right: 8px;
  cursor: pointer;
  color: #cccccc;
  transition: color 0.1s ease;
}
.swal2-modal .swal2-close:hover {
  color: #d55;
}
.swal2-modal > .swal2-input, .swal2-modal > .swal2-file, .swal2-modal > .swal2-textarea, .swal2-modal > .swal2-select, .swal2-modal > .swal2-radio, .swal2-modal > .swal2-checkbox {
  display: none;
}
.swal2-modal .swal2-content {
  font-size: 18px;
  text-align: center;
  font-weight: 300;
  position: relative;
  float: none;
  margin: 0;
  padding: 0;
  line-height: normal;
  color: #545454;
  word-wrap: break-word;
}
.swal2-modal .swal2-input, .swal2-modal .swal2-file, .swal2-modal .swal2-textarea, .swal2-modal .swal2-select, .swal2-modal .swal2-radio, .swal2-modal .swal2-checkbox {
  margin: 20px auto;
}
.swal2-modal .swal2-input, .swal2-modal .swal2-file, .swal2-modal .swal2-textarea {
  width: 100%;
  box-sizing: border-box;
  font-size: 18px;
  border-radius: 3px;
  border: 1px solid #d9d9d9;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.06);
  transition: border-color box-shadow 0.3s;
}
.swal2-modal .swal2-input.swal2-inputerror, .swal2-modal .swal2-file.swal2-inputerror, .swal2-modal .swal2-textarea.swal2-inputerror {
  border-color: #f27474 !important;
  box-shadow: 0 0 2px #f27474 !important;
}
.swal2-modal .swal2-input:focus, .swal2-modal .swal2-file:focus, .swal2-modal .swal2-textarea:focus {
  outline: none;
  border: 1px solid #b4dbed;
  box-shadow: 0 0 3px #c4e6f5;
}
.swal2-modal .swal2-input::-webkit-input-placeholder, .swal2-modal .swal2-file::-webkit-input-placeholder, .swal2-modal .swal2-textarea::-webkit-input-placeholder, .swal2-modal .swal2-input:-ms-input-placeholder, .swal2-modal .swal2-file:-ms-input-placeholder, .swal2-modal .swal2-textarea:-ms-input-placeholder, .swal2-modal .swal2-input::placeholder, .swal2-modal .swal2-file::placeholder, .swal2-modal .swal2-textarea::placeholder {
  color: #e6e6e6;
}
.swal2-modal .swal2-range input {
  float: left;
  width: 80%;
}
.swal2-modal .swal2-range output {
  float: right;
  width: 20%;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
}
.swal2-modal .swal2-range input, .swal2-modal .swal2-range output {
  height: 43px;
  line-height: 43px;
  vertical-align: middle;
  margin: 20px auto;
  padding: 0;
}
.swal2-modal .swal2-input {
  height: 43px;
  padding: 0 12px;
}
.swal2-modal .swal2-input[type=number] {
  max-width: 150px;
}
.swal2-modal .swal2-file {
  font-size: 20px;
}
.swal2-modal .swal2-textarea {
  height: 108px;
  padding: 12px;
}
.swal2-modal .swal2-select {
  color: #545454;
  font-size: inherit;
  padding: 5px 10px;
  min-width: 40%;
  max-width: 100%;
}
.swal2-modal .swal2-radio {
  border: 0;
}
.swal2-modal .swal2-radio label:not(:first-child) {
  margin-left: 20px;
}
.swal2-modal .swal2-radio input, .swal2-modal .swal2-radio span {
  vertical-align: middle;
}
.swal2-modal .swal2-radio input {
  margin: 0 3px 0 0;
}
.swal2-modal .swal2-checkbox {
  color: #545454;
}
.swal2-modal .swal2-checkbox input, .swal2-modal .swal2-checkbox span {
  vertical-align: middle;
}
.swal2-modal .swal2-validationerror {
  background-color: #f0f0f0;
  margin: 0 -20px;
  overflow: hidden;
  padding: 10px;
  color: gray;
  font-size: 16px;
  font-weight: 300;
  display: none;
}
.swal2-modal .swal2-validationerror::before {
  content: "!";
  display: inline-block;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: #ea7d7d;
  color: #fff;
  line-height: 24px;
  text-align: center;
  margin-right: 10px;
}

@supports (-ms-accelerator: true) {
  .swal2-range input {
    width: 100% !important;
  }
  .swal2-range output {
    display: none;
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .swal2-range input {
    width: 100% !important;
  }
  .swal2-range output {
    display: none;
  }
}
.swal2-icon {
  width: 80px;
  height: 80px;
  border: 4px solid transparent;
  border-radius: 50%;
  margin: 20px auto 30px;
  padding: 0;
  position: relative;
  box-sizing: content-box;
  cursor: default;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.swal2-icon.swal2-error {
  border-color: #f27474;
}
.swal2-icon.swal2-error .swal2-x-mark {
  position: relative;
  display: block;
}
.swal2-icon.swal2-error [class^=swal2-x-mark-line] {
  position: absolute;
  height: 5px;
  width: 47px;
  background-color: #f27474;
  display: block;
  top: 37px;
  border-radius: 2px;
}
.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=left] {
  transform: rotate(45deg);
  left: 17px;
}
.swal2-icon.swal2-error [class^=swal2-x-mark-line][class$=right] {
  transform: rotate(-45deg);
  right: 16px;
}
.swal2-icon.swal2-warning {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #f8bb86;
  border-color: #facea8;
  font-size: 60px;
  line-height: 80px;
  text-align: center;
}
.swal2-icon.swal2-info {
  font-family: "Open Sans", sans-serif;
  color: #3fc3ee;
  border-color: #9de0f6;
  font-size: 60px;
  line-height: 80px;
  text-align: center;
}
.swal2-icon.swal2-question {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #87adbd;
  border-color: #c9dae1;
  font-size: 60px;
  line-height: 80px;
  text-align: center;
}
.swal2-icon.swal2-success {
  border-color: #a5dc86;
}
.swal2-icon.swal2-success [class^=swal2-success-circular-line] {
  border-radius: 50%;
  position: absolute;
  width: 60px;
  height: 120px;
  transform: rotate(45deg);
}
.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=left] {
  border-radius: 120px 0 0 120px;
  top: -7px;
  left: -33px;
  transform: rotate(-45deg);
  transform-origin: 60px 60px;
}
.swal2-icon.swal2-success [class^=swal2-success-circular-line][class$=right] {
  border-radius: 0 120px 120px 0;
  top: -11px;
  left: 30px;
  transform: rotate(-45deg);
  transform-origin: 0 60px;
}
.swal2-icon.swal2-success .swal2-success-ring {
  width: 80px;
  height: 80px;
  border: 4px solid rgba(165, 220, 134, 0.2);
  border-radius: 50%;
  box-sizing: content-box;
  position: absolute;
  left: -4px;
  top: -4px;
  z-index: 2;
}
.swal2-icon.swal2-success .swal2-success-fix {
  width: 7px;
  height: 90px;
  position: absolute;
  left: 28px;
  top: 8px;
  z-index: 1;
  transform: rotate(-45deg);
}
.swal2-icon.swal2-success [class^=swal2-success-line] {
  height: 5px;
  background-color: #a5dc86;
  display: block;
  border-radius: 2px;
  position: absolute;
  z-index: 2;
}
.swal2-icon.swal2-success [class^=swal2-success-line][class$=tip] {
  width: 25px;
  left: 14px;
  top: 46px;
  transform: rotate(45deg);
}
.swal2-icon.swal2-success [class^=swal2-success-line][class$=long] {
  width: 47px;
  right: 8px;
  top: 38px;
  transform: rotate(-45deg);
}

.swal2-progresssteps {
  font-weight: 600;
  margin: 0 0 20px;
  padding: 0;
}
.swal2-progresssteps li {
  display: inline-block;
  position: relative;
}
.swal2-progresssteps .swal2-progresscircle {
  background: #3085d6;
  border-radius: 2em;
  color: #fff;
  height: 2em;
  line-height: 2em;
  text-align: center;
  width: 2em;
  z-index: 20;
}
.swal2-progresssteps .swal2-progresscircle:first-child {
  margin-left: 0;
}
.swal2-progresssteps .swal2-progresscircle:last-child {
  margin-right: 0;
}
.swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep {
  background: #3085d6;
}
.swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep ~ .swal2-progresscircle, .swal2-progresssteps .swal2-progresscircle.swal2-activeprogressstep ~ .swal2-progressline {
  background: #add8e6;
}
.swal2-progresssteps .swal2-progressline {
  background: #3085d6;
  height: 0.4em;
  margin: 0 -1px;
  z-index: 10;
}

[class^=swal2] {
  -webkit-tap-highlight-color: transparent;
}
@keyframes showSweetAlert {
  0% {
    transform: scale(0.7);
  }
  45% {
    transform: scale(1.05);
  }
  80% {
    transform: scale(0.95);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes hideSweetAlert {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(0.5);
    opacity: 0;
  }
}
.swal2-show {
  animation: showSweetAlert 0.3s;
}
.swal2-show.swal2-noanimation {
  animation: none;
}

.swal2-hide {
  animation: hideSweetAlert 0.15s forwards;
}
.swal2-hide.swal2-noanimation {
  animation: none;
}
@keyframes animate-success-tip {
  0% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  54% {
    width: 0;
    left: 1px;
    top: 19px;
  }
  70% {
    width: 50px;
    left: -8px;
    top: 37px;
  }
  84% {
    width: 17px;
    left: 21px;
    top: 48px;
  }
  100% {
    width: 25px;
    left: 14px;
    top: 45px;
  }
}
@keyframes animate-success-long {
  0% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  65% {
    width: 0;
    right: 46px;
    top: 54px;
  }
  84% {
    width: 55px;
    right: 0;
    top: 35px;
  }
  100% {
    width: 47px;
    right: 8px;
    top: 38px;
  }
}
@keyframes rotatePlaceholder {
  0% {
    transform: rotate(-45deg);
  }
  5% {
    transform: rotate(-45deg);
  }
  12% {
    transform: rotate(-405deg);
  }
  100% {
    transform: rotate(-405deg);
  }
}
.swal2-animate-success-line-tip {
  animation: animate-success-tip 0.75s;
}

.swal2-animate-success-line-long {
  animation: animate-success-long 0.75s;
}

.swal2-success.swal2-animate-success-icon .swal2-success-circular-line-right {
  animation: rotatePlaceholder 4.25s ease-in;
}
@keyframes animate-error-icon {
  0% {
    transform: rotateX(100deg);
    opacity: 0;
  }
  100% {
    transform: rotateX(0deg);
    opacity: 1;
  }
}
.swal2-animate-error-icon {
  animation: animate-error-icon 0.5s;
}
@keyframes animate-x-mark {
  0% {
    transform: scale(0.4);
    margin-top: 26px;
    opacity: 0;
  }
  50% {
    transform: scale(0.4);
    margin-top: 26px;
    opacity: 0;
  }
  80% {
    transform: scale(1.15);
    margin-top: -6px;
  }
  100% {
    transform: scale(1);
    margin-top: 0;
    opacity: 1;
  }
}
.swal2-animate-x-mark {
  animation: animate-x-mark 0.5s;
}
@keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*****************************************
 Cropper
*****************************************/
/*!
 * Cropper.js v1.5.7
 * https://fengyuanchen.github.io/cropperjs
 *
 * Copyright 2015-present Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2020-05-23T05:22:57.283Z
 */
.cropper-container {
  direction: ltr;
  font-size: 0;
  line-height: 0;
  position: relative;
  touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.cropper-container img {
  display: block;
  height: 100%;
  image-orientation: 0deg;
  max-height: none !important;
  max-width: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  width: 100%;
}

.cropper-wrap-box,
.cropper-canvas,
.cropper-drag-box,
.cropper-crop-box,
.cropper-modal {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.cropper-wrap-box,
.cropper-canvas {
  overflow: hidden;
}

.cropper-drag-box {
  background-color: #fff;
  opacity: 0;
}

.cropper-modal {
  background-color: #000;
  opacity: 0.5;
}

.cropper-view-box {
  display: block;
  height: 100%;
  outline: 1px solid #39f;
  outline-color: rgba(51, 153, 255, 0.75);
  overflow: hidden;
  width: 100%;
}

.cropper-dashed {
  border: 0 dashed #eee;
  display: block;
  opacity: 0.5;
  position: absolute;
}

.cropper-dashed.dashed-h {
  border-bottom-width: 1px;
  border-top-width: 1px;
  height: 33.3333333333%;
  left: 0;
  top: 33.3333333333%;
  width: 100%;
}

.cropper-dashed.dashed-v {
  border-left-width: 1px;
  border-right-width: 1px;
  height: 100%;
  left: 33.3333333333%;
  top: 0;
  width: 33.3333333333%;
}

.cropper-center {
  display: block;
  height: 0;
  left: 50%;
  opacity: 0.75;
  position: absolute;
  top: 50%;
  width: 0;
}

.cropper-center::before,
.cropper-center::after {
  background-color: #eee;
  content: " ";
  display: block;
  position: absolute;
}

.cropper-center::before {
  height: 1px;
  left: -3px;
  top: 0;
  width: 7px;
}

.cropper-center::after {
  height: 7px;
  left: 0;
  top: -3px;
  width: 1px;
}

.cropper-face,
.cropper-line,
.cropper-point {
  display: block;
  height: 100%;
  opacity: 0.1;
  position: absolute;
  width: 100%;
}

.cropper-face {
  background-color: #fff;
  left: 0;
  top: 0;
}

.cropper-line {
  background-color: #39f;
}

.cropper-line.line-e {
  cursor: ew-resize;
  right: -3px;
  top: 0;
  width: 5px;
}

.cropper-line.line-n {
  cursor: ns-resize;
  height: 5px;
  left: 0;
  top: -3px;
}

.cropper-line.line-w {
  cursor: ew-resize;
  left: -3px;
  top: 0;
  width: 5px;
}

.cropper-line.line-s {
  bottom: -3px;
  cursor: ns-resize;
  height: 5px;
  left: 0;
}

.cropper-point {
  background-color: #39f;
  height: 5px;
  opacity: 0.75;
  width: 5px;
}

.cropper-point.point-e {
  cursor: ew-resize;
  margin-top: -3px;
  right: -3px;
  top: 50%;
}

.cropper-point.point-n {
  cursor: ns-resize;
  left: 50%;
  margin-left: -3px;
  top: -3px;
}

.cropper-point.point-w {
  cursor: ew-resize;
  left: -3px;
  margin-top: -3px;
  top: 50%;
}

.cropper-point.point-s {
  bottom: -3px;
  cursor: s-resize;
  left: 50%;
  margin-left: -3px;
}

.cropper-point.point-ne {
  cursor: nesw-resize;
  right: -3px;
  top: -3px;
}

.cropper-point.point-nw {
  cursor: nwse-resize;
  left: -3px;
  top: -3px;
}

.cropper-point.point-sw {
  bottom: -3px;
  cursor: nesw-resize;
  left: -3px;
}

.cropper-point.point-se {
  bottom: -3px;
  cursor: nwse-resize;
  height: 20px;
  opacity: 1;
  right: -3px;
  width: 20px;
}

@media (min-width: 768px) {
  .cropper-point.point-se {
    height: 15px;
    width: 15px;
  }
}
@media (min-width: 992px) {
  .cropper-point.point-se {
    height: 10px;
    width: 10px;
  }
}
@media (min-width: 1200px) {
  .cropper-point.point-se {
    height: 5px;
    opacity: 0.75;
    width: 5px;
  }
}
.cropper-point.point-se::before {
  background-color: #39f;
  bottom: -50%;
  content: " ";
  display: block;
  height: 200%;
  opacity: 0;
  position: absolute;
  right: -50%;
  width: 200%;
}

.cropper-invisible {
  opacity: 0;
}

.cropper-bg {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC");
}

.cropper-hide {
  display: block;
  height: 0;
  position: absolute;
  width: 0;
}

.cropper-hidden {
  display: none !important;
}

.cropper-move {
  cursor: move;
}

.cropper-crop {
  cursor: crosshair;
}

.cropper-disabled .cropper-drag-box,
.cropper-disabled .cropper-face,
.cropper-disabled .cropper-line,
.cropper-disabled .cropper-point {
  cursor: not-allowed;
}

/*****************************************
 コンポーネント
*****************************************/
.window_bg {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  position: fixed;
  z-index: 10000;
  /* 998 */
  top: 0;
  left: 0;
}

.sns_login {
  border-radius: 6px;
  background-color: #F5F5F5;
  box-sizing: border-box;
  padding: 10px;
  margin-bottom: 10px;
  text-align: center;
}
.sns_login .title {
  font-size: 12px;
  line-height: 14px;
  text-align: center;
}
.sns_login img {
  border-radius: 50%;
  margin: 10px;
  width: 40px;
  height: 40px;
}

.register_area {
  padding-top: 10px;
}
.register_area .title {
  font-size: 16px;
  line-height: 18px;
  text-align: center;
  padding-bottom: 15px;
}
.register_area .btn_submit {
  border-radius: 6px;
  height: 50px !important;
  width: 100%;
  text-align: center;
  vertical-align: middle;
  background-color: #999999 !important;
  color: #FFF;
  font-size: 20px !important;
  line-height: 50px !important;
  margin-bottom: 20px;
  box-sizing: border-box;
}

/*****************************************
 ヘッダー
*****************************************/
header {
  background-color: #fff;
  width: 100%;
}
header section {
  box-sizing: border-box;
  margin: 0 auto;
  width: 996px;
  text-align: left;
}
header .header_top {
  background-color: #343434;
  width: 100%;
  height: 28px;
}
header .header_top .header_top_inner {
  width: 996px;
  margin: 0 auto;
  font-size: 0;
}
header .header_top .header_top_inner h1 {
  display: inline-block;
  margin: 0;
  width: 250px;
  color: #d8fcfc;
  font-size: 12px;
  font-weight: normal;
  line-height: 28px;
}
header .header_top .header_top_inner h1.maintenance_mode {
  color: #ff6e6e;
  font-weight: bold;
}
header .header_top .header_top_inner .header_top_navi {
  display: inline;
  font-size: 0;
}
header .header_top .header_top_inner .header_top_navi li {
  display: inline-block;
}
header .header_top .header_top_inner .header_top_navi li a {
  display: inline-block;
  list-style: none;
  width: 90px;
  text-align: center;
  line-height: 28px;
  color: #fff;
  font-size: 12px;
}
header .header_top .header_top_inner .header_top_navi li a.here {
  background-color: #fff;
  color: #333;
}
header .header_top .header_top_inner .header_top_navi li a:hover {
  background-color: #ededed;
  color: #333;
}
header .header_top .header_top_inner .social_button_area {
  position: relative;
  display: inline-block;
  float: right;
  box-sizing: border-box;
  height: 28px;
}
header .header_top .header_top_inner .social_button_area .header_facebook {
  position: absolute;
  top: 4px;
  right: 125px;
  display: inline-block;
}
header .header_top .header_top_inner .social_button_area .header_twitter {
  display: inline-block;
  margin-top: 4px;
}
header .header_bottom {
  height: 76px;
  font-size: 12px;
}
header .header_bottom nav[class$=_area] {
  display: table-cell;
  box-sizing: border-box;
  vertical-align: middle;
  height: 76px;
}
header .header_bottom .f_l nav[class$=_area]:not(:last-of-type) {
  padding-right: 36px;
}
header .header_bottom .f_r nav[class$=_area]:not(:last-of-type) {
  padding-right: 32px;
}
header .header_bottom .site_logo_area .site_logo {
  width: 50px;
  height: 50px;
}
header .header_bottom .searchbox_area .searchbox {
  position: relative;
  box-sizing: border-box;
  border: 1px solid #bebebe;
  border-radius: 4px;
  vertical-align: top;
  padding: 4px 0;
  width: 220px;
  height: 40px;
  text-align: left;
  font-size: 0;
}
header .header_bottom .searchbox_area .searchbox input[type=text] {
  border: none;
  box-sizing: border-box;
  padding: 0 8px;
  width: 178px;
  height: 30px;
  font-size: 12px;
  line-height: 14px;
}
header .header_bottom .searchbox_area .searchbox input:focus {
  outline: none;
}
header .header_bottom .searchbox_area .searchbox .submit {
  display: inline-block;
  background: url("/img/icon_search.png") no-repeat center left, #fff;
  background-size: 20px 20px;
  border: none;
  border-radius: 0 20px 20px 0;
  vertical-align: top;
  margin: 0 0 0 10px;
  width: 26px;
  height: 26px;
  cursor: pointer;
}
header .header_bottom .list_navigation_area .list_navigation {
  margin-left: -10px;
  font-size: 0;
}
header .header_bottom .list_navigation_area .list_navigation li {
  position: relative;
  display: inline-block;
  height: 18px;
  line-height: 18px;
  font-size: 12px;
}
header .header_bottom .list_navigation_area .list_navigation li:not(:empty) {
  padding: 0 10px;
}
header .header_bottom .list_navigation_area .list_navigation li:not(:empty):not(:last-of-type) {
  border-right: 1px solid #ededed;
}
header .header_bottom .list_navigation_area .list_navigation li a {
  color: #999;
}
header .header_bottom .list_navigation_area .list_navigation li a:hover {
  color: #0099ff;
  text-decoration: underline;
}
header .header_bottom .list_navigation_area .list_navigation li .icon_badge {
  position: relative;
  top: -10px;
  z-index: 100;
  float: right;
}
header .header_bottom .register_button_area,
header .header_bottom .login_button_area {
  padding-right: 20px !important;
}
header .header_bottom .register_button_area .register_button,
header .header_bottom .register_button_area .login_button,
header .header_bottom .login_button_area .register_button,
header .header_bottom .login_button_area .login_button {
  display: block;
  background-color: #35d0e5;
  border-radius: 3px;
  width: 120px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  color: #fff;
}
header .header_bottom .notifications_area {
  padding-right: 0 !important;
}
header .header_bottom .notifications_area .icon_badge {
  top: -11px;
  left: 26px;
}
header .header_bottom .messages_area {
  position: relative;
}
header .header_bottom .messages_area .icon_badge {
  top: 16px;
  left: 20px;
}
header .header_bottom .user_icon_area .img_user {
  border-radius: 3px;
  width: 30px;
  height: 30px;
}
header .header_bottom .icon_header_menu_area {
  position: relative;
  text-align: right;
}
header .header_bottom .icon_header_menu_area .icon_header_menu {
  background-color: #333;
  border-radius: 3px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 28px;
  cursor: pointer;
}
header .header_bottom .icon_header_menu_area .icon_header_menu:after {
  content: "\F0C9";
  font-family: FontAwesome;
  color: #fff;
}
header .header_bottom .icon_header_menu_area .icon_badge {
  top: 12px;
  left: 30px;
  font-size: 12px;
  font-weight: bold;
}
header .notification_dot {
  position: absolute;
  top: -1px;
  right: 4px;
  background-color: #ff0000;
  border-radius: 3px;
  width: 6px;
  height: 6px;
}
header .mg1 {
  background: #3399FF;
}
header .mg2 {
  background: #FF0000;
}
header .mg3 {
  background: #FF9900;
}
header .mg4 {
  background: #66CC00;
}
header .mg5 {
  background: #FF3399;
}
header .mg6 {
  background: #CC66FF;
}

div.icon_notification {
  position: relative;
  margin-right: 20px;
  text-align: right;
}
div.icon_notification img.toggle_button {
  vertical-align: top;
  cursor: pointer;
}

/*****************************************
 ヘッダーメニュー
*****************************************/
div.header_menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #f6f7f9;
  border-radius: 0 0 6px 6px;
}
div.header_menu li {
  float: left;
}
div.header_menu li a.here {
  box-sizing: border-box;
  display: block;
  color: #CCC;
  text-align: center;
  padding-top: 14px;
  text-decoration: none;
  width: 105px;
  height: 40px;
  border-right: solid 1px #E2E2E2;
  background-color: #FFF;
}
div.header_menu li a.not {
  box-sizing: border-box;
  display: block;
  color: #666;
  text-align: center;
  padding-top: 14px;
  text-decoration: none;
  width: 105px;
  height: 40px;
  border-right: solid 1px #E2E2E2;
}
div.header_menu li a:hover {
  background-color: #3399FF;
  color: #FFF;
}

/*****************************************
 フッター
*****************************************/
.adjust_footer {
  height: 100px;
  clear: both;
}

footer {
  position: fixed;
  bottom: 0;
  background: #FFF;
  width: 100%;
  height: 100px;
  z-index: 999;
  opacity: 0.8;
}
footer p {
  margin: 0;
  padding: 5px 10px;
}
footer .footer_item_list {
  text-align: center;
}
footer.tag_cloud div {
  padding-top: 15px;
}
footer.tag_cloud div span {
  margin-right: 15px;
}

/*****************************************
 ディレクトリメニュー
*****************************************/
.directory_menu {
  margin: 8px -12px 0 -12px;
  border-top: 1px solid #ededed;
  font-size: 0;
}
.directory_menu li {
  display: inline-block;
  box-sizing: border-box;
  width: 25%;
  height: 40px;
  text-align: center;
  line-height: 40px;
  font-size: 12px;
}
.directory_menu li:not(:nth-of-type(4)) {
  border-right: 1px solid #ededed;
}
.directory_menu li:first-child a {
  border-radius: 0 0 0 6px;
}
.directory_menu li:nth-child(4) a {
  border-radius: 0 0 6px 0;
}
.directory_menu li a {
  display: block;
  color: #999;
}
.directory_menu li a:hover, .directory_menu li a.here {
  background: #0099ff;
  color: #fff;
  text-decoration: none;
}

form .note-success {
  font-size: 12px;
  padding: 5px 0 0 5px;
  color: #28a745;
}
form .note-error {
  font-size: 12px;
  padding: 5px 0 0 5px;
  color: #dc3545;
}
form .form_name {
  font-size: 14px;
  line-height: 16px;
  margin-bottom: 5px;
  font-weight: normal;
  color: #000;
  text-align: left;
}
form .form_name span {
  font-size: 12px;
  line-height: 16px;
  color: #666;
}
form label {
  cursor: pointer;
}
form .form_unchangeable {
  padding: 15px;
  font-size: 14px;
  font-weight: normal;
  color: #666;
  border: solid 1px #ccc;
  background-color: #EEE;
  margin-bottom: 20px;
  width: 100%;
  box-sizing: border-box;
  border-radius: 3px;
  text-align: left;
}
form .form-group {
  margin-bottom: 20px;
}
form input, form textarea, form select {
  font-size: 14px;
  line-height: 16px;
  font-weight: normal;
  color: #000;
  border: solid 1px #ccc;
  width: 100%;
  box-sizing: border-box;
  border-radius: 3px;
  text-align: left;
}
form input, form textarea {
  padding: 15px;
}
form select {
  height: 40px;
}
form .btn_submit {
  border-radius: 6px;
  height: 50px;
  width: 100%;
  text-align: center;
  vertical-align: middle;
  background-color: #32CBFD;
  color: #FFF;
  font-size: 20px;
  line-height: 50px;
  box-sizing: border-box;
  cursor: pointer;
}
form .radio,
form .checkbox {
  box-sizing: border-box;
  transition: background-color 0.2s linear;
  position: relative;
  display: inline-block;
  margin: 0 20px 8px 0;
  padding: 12px 12px 12px 42px;
  vertical-align: middle;
  cursor: pointer;
}
form .radio:hover,
form .checkbox:hover {
  background-color: #e2edd7;
}
form .radio:hover:after,
form .checkbox:hover:after {
  border-color: #53b300;
}
form .radio:after,
form .checkbox:after {
  transition: border-color 0.2s linear;
  position: absolute;
  top: 50%;
  left: 15px;
  display: block;
  margin-top: -10px;
  width: 16px;
  height: 16px;
  border: 2px solid #CCC;
  content: "";
}
form .radio:after {
  border-radius: 100%;
  background-color: #FFF;
}
form .radio:before {
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;
  left: 20px;
  display: block;
  margin-top: -5px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background-color: #53b300;
  content: "";
  opacity: 0;
}
input[type=radio]:checked + form .radio:before {
  opacity: 1;
}
form .checkbox:after {
  border-radius: 3px;
  background-color: #FFF;
}
form .checkbox:before {
  transition: opacity 0.2s linear;
  position: absolute;
  top: 50%;
  left: 21px;
  display: block;
  margin-top: -7px;
  width: 5px;
  height: 9px;
  border-right: 3px solid #53b300;
  border-bottom: 3px solid #53b300;
  content: "";
  opacity: 0;
  transform: rotate(45deg);
}
input[type=checkbox]:checked + form .checkbox:before {
  opacity: 1;
}
form label.large_input {
  display: inline-block;
  padding: 8px 4px;
  height: 20px;
  width: 100%;
  line-height: 26px;
  text-align: left;
  clear: both;
}
form label.large_input:after {
  content: " ";
  display: block;
  clear: both;
}
form label.large_input input[type=checkbox], form label.large_input input[type=radio] {
  display: none;
}
form label.large_input input[type=checkbox] + span:before {
  transition: border-color 0.2s linear;
  display: block;
  float: left;
  margin-right: 6px;
  border: 2px solid #ccc;
  border-radius: 4px;
  width: 20px;
  height: 20px;
  font-size: 16px;
  font-family: FontAwesome;
  color: #32CCFE;
  text-align: center;
  line-height: 20px;
  content: "";
}
form label.large_input input[type=radio] + span:before {
  transition: border-color 0.2s linear;
  display: block;
  float: left;
  margin-right: 6px;
  border: 2px solid #ccc;
  border-radius: 4px;
  width: 20px;
  height: 20px;
  font-size: 16px;
  font-family: FontAwesome;
  color: #32CCFE;
  text-align: center;
  line-height: 20px;
  content: "";
  border-radius: 20px;
}
form label.large_input input[type=checkbox]:checked + span:before, form label.large_input input[type=radio]:checked + span:before {
  border-color: #32CCFE;
}
form label.large_input:hover {
  background-color: #f6f6f6;
}
form label.large_input:hover input[type=checkbox] + span:before, form label.large_input:hover input[type=radio] + span:before {
  border-color: #32CCFE;
}
form label.large_input input[type=checkbox]:checked + span:before {
  content: "\F00C";
}
form label.large_input input[type=radio]:checked + span:before {
  font-size: 16px;
  content: "\F111";
}
form label.large_input.disabled {
  color: #ccc;
}
form label.large_input.disabled:hover {
  background-color: transparent;
  cursor: default;
}
form label.large_input.disabled:hover input[type=checkbox] + span:before, form label.large_input.disabled:hover input[type=radio] + span:before {
  border-color: #ccc;
  color: #ccc;
}
form label.large_input.disabled input[type=checkbox] + span:before, form label.large_input.disabled input[type=radio] + span:before {
  border-color: #ccc;
  color: #ccc;
}

/*****************************************
 ページフォーマット
*****************************************/
.manage .main_field {
  background-color: #FFF;
  padding: 20px;
  border-radius: 5px;
  box-sizing: border-box;
  min-height: 640px;
}
.manage .manage_header h2 {
  margin-bottom: 12px;
  font-size: 22px;
  font-weight: normal;
}
.manage .manage_header ul {
  list-style-type: none;
  display: inline;
  font-size: 0;
  float: left;
}
.manage .manage_header ul li {
  font-size: 12px;
  display: inline-block;
  color: #CCCCCC;
}
.manage .manage_header ul li + li:before {
  content: "|";
  margin: 0 6px;
  font-size: 14px;
}
.manage .manage_header ul li.current {
  font-size: 22px;
}
.manage .manage_header ul li a {
  color: #4D4D4D;
}
.manage .manage_header .note {
  padding: 8px 0;
  color: #999;
  float: left;
  clear: both;
}
.manage .manage_list {
  clear: both;
  display: flex;
  justify-content: space-between;
  border-top: 1px solid #EDEDED;
  padding: 10px 0;
  align-items: center;
  text-align: center;
}
.manage .manage_list em {
  color: #f00;
  font-weight: bold;
  font-style: inherit;
  width: 100%;
  padding: 0 5px;
}
.manage .manage_list .thumb_icon_area {
  flex-basis: 10%;
}
.manage .manage_list .thumb_icon_area img {
  width: 45px;
  height: 45px;
}
.manage .manage_list .name_area {
  text-align: left;
  width: 100%;
  padding: 0 10px;
}
.manage .manage_list .name_area a {
  color: #333;
  font-size: 16px;
  display: inline-block;
  padding: 3px 0;
}
.manage .manage_list .name_area a.user_name {
  font-size: 12px;
}
.manage .manage_list .name_area a span {
  margin-left: 4px;
  font-size: 12px;
  color: #999;
}
.manage .manage_list .name_area .comment {
  margin: 4px 0 0 0;
  color: #999;
}
@media all and (-ms-high-contrast: none) {
  .manage .manage_list .name_area {
    padding: 0 10px 0 20px; /* IE10以上 */
  }
}
.manage .manage_list .controller_area {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.manage .manage_list .controller_area select {
  font-size: 14px;
  color: #333;
  border: solid 1px #ccc;
  width: 110px;
  box-sizing: border-box;
  border-radius: 3px;
}
.manage .manage_list .controller_area select:not([disabled]) {
  cursor: pointer;
}
.manage .manage_list .controller_area .btn_change {
  box-sizing: border-box;
  border-radius: 3px;
  padding: 5px;
  font-size: 14px;
  font-weight: normal;
  cursor: pointer;
  border: 1px solid #CCC;
}
.manage .manage_list .controller_area .btn_icon {
  width: 100%;
  text-align: center;
  font-size: 24px;
  cursor: pointer;
}
.manage .manage_list .controller_area .btn_icon .fa-unlock {
  color: #ccc;
}

/* ユーザーのコンペ参加取り消し処理 確認modal */
.swal_remove_competition_item {
  padding: 16px !important;
}
.swal_remove_competition_item .swal2-icon {
  width: 60px;
  height: 60px;
  margin: 10px auto 20px;
}
.swal_remove_competition_item .swal2-warning {
  font-size: 40px;
  line-height: 60px;
}
.swal_remove_competition_item img.swal2-image {
  width: 100px;
  height: 100px;
}
.swal_remove_competition_item h2#swal2-title {
  font-size: 22px;
}
.swal_remove_competition_item .swal2-input::-moz-placeholder {
  color: #999;
}
.swal_remove_competition_item .swal2-input::placeholder {
  color: #999;
}

/*****************************************
 ノーマルフォーム
*****************************************/
.normal_form {
  background-color: #fff;
  padding: 30px;
}
.normal_form .inner h2 {
  text-align: center;
}
.normal_form .inner .description {
  text-align: left;
  color: #000;
  margin-bottom: 20px;
  border-radius: 6px;
  background-color: #F5F5F5;
  padding: 15px;
  line-height: 20px;
}
.normal_form .inner .g-recaptcha {
  margin-bottom: 30px;
}
.normal_form .inner .radio_button_area {
  margin-bottom: 18px;
}
.normal_form .inner .attention {
  font-size: 12px;
  font-weight: normal;
  line-height: 14px;
  text-align: center;
  color: #000;
  margin-top: 20px;
  margin-bottom: 20px;
  border-radius: 6px;
  border: 1px solid #EDEDED;
  background-color: #F5F5F5;
  padding: 15px;
}
.normal_form .error {
  background-color: #f2dede;
  margin-bottom: 16px;
  padding: 12px;
  border-radius: 3px;
}
.normal_form .withdrawal_alert_message {
  border: 1px solid #CCC;
  border-radius: 3px;
  padding: 15px;
  height: 120px;
  font-size: 14px;
  margin-bottom: 20px;
}

/*****************************************
 投稿フォーム
*****************************************/
div.content_form {
  background-color: #FFF;
  padding: 25px 20px;
}
div.content_form h2 {
  width: 100%;
  text-align: center;
  margin-bottom: 25px;
  font-size: 24px;
  line-height: 26px;
  font-weight: normal;
}
div.content_form h3 {
  width: 100%;
  text-align: left;
  margin-bottom: 10px;
  padding-left: 10px;
  font-size: 20px;
  line-height: 22px;
  font-weight: normal;
}
div.content_form dl dt {
  font-size: 20px;
  line-height: 22px;
  color: #000;
  padding: 4px 0;
}
div.content_form .form_img {
  width: 560px;
  height: 300px;
  background-color: #DDEEFF;
  margin-bottom: 20px;
  color: #FFF;
  text-align: center;
}
div.content_form .img_exist {
  width: 560px;
  background-color: #DDEEFF;
  margin-bottom: 20px;
  color: #FFF;
  text-align: center;
}
div.content_form .img_preview {
  width: 100%;
  height: auto;
  position: relative;
}
div.content_form .img_add_area {
  clear: both;
  width: 200px;
  height: 200px;
  background-color: #DDEEFF;
  color: #FFF;
  text-align: center;
  margin: 0 5px 20px 0;
  float: left;
}
div.content_form .title input {
  border-radius: 3px;
  box-sizing: border-box;
  padding-left: 15px;
  padding-right: 15px;
  font-size: 16px;
  color: #000;
  width: 100%;
  height: 50px;
  border: solid 1px #D1E5F2;
}
div.content_form .caption textarea {
  box-sizing: border-box;
  padding: 15px;
  font-size: 14px;
  line-height: 16px;
  color: #000;
  width: 100%;
  border: solid 1px #D1E5F2;
  margin-bottom: 0;
  resize: vertical;
}
div.content_form .tool_area {
  clear: both;
}
div.content_form .tool_area dl {
  margin: 0 -10px 0 0;
}
div.content_form .tool_area dl dd {
  position: relative;
  width: 120px;
  height: 120px;
  box-sizing: border-box;
  background-color: #D4DBEE;
  color: #FFF;
  text-align: center;
  margin: 0 12px 12px 0;
  float: left;
}
div.content_form .tool_area dl dd .close_btn {
  position: absolute;
  z-index: 100;
  top: -6px;
  right: -6px;
  width: 18px;
  height: 18px;
  background-color: #fff;
  border: 1px solid #666;
  border-radius: 4px;
  color: #666;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 18px;
  cursor: pointer;
}
div.content_form .tool_area dl dd .close_btn:hover {
  color: #999;
  border-color: #999;
}
div.content_form .tool_area dl dd .item_kit {
  position: relative;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
div.content_form .tool_area dl dd .item_kit:hover {
  opacity: 0.8;
}
div.content_form .tool_area dl dd .item_kit img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0px);
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}
div.content_form .tool_area dl dd .item_kit .hint {
  position: absolute;
  display: inline-block;
  width: 80px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
div.content_form .tag_area,
div.content_form .project_tag_area {
  clear: both;
  position: relative;
  margin-bottom: 20px;
}
div.content_form .tag_area .suggest_list {
  position: absolute;
  background-color: #FFF;
  border: solid 1px #000;
  padding: 10px;
  height: 300px;
  overflow-y: auto;
  z-index: 99;
}
div.content_form .tag_area .suggest_list p {
  padding: 3px 0;
}
div.content_form .tag_area .suggest_list p:hover {
  background-color: #0099FF;
  cursor: pointer;
}
div.content_form .category_area {
  clear: both;
  padding-top: 10px;
  margin-bottom: 20px;
}
div.content_form .category_area select {
  width: 100%;
  height: 50px;
  font-size: 14px;
  color: #000;
  border: solid 1px #69D9FE;
}
div.content_form .share_area {
  clear: both;
}
div.content_form .btn_area {
  text-align: center;
}
div.content_form .btn_area button {
  display: inline-block;
  box-sizing: border-box;
  border-radius: 10px;
  margin: 4px 12px;
  width: 200px;
  height: 48px;
  line-height: 48px;
  font-size: 14px;
  cursor: pointer;
}
div.content_form .btn_area button:hover {
  opacity: 0.8;
}
div.content_form .btn_area button.save {
  background-color: #32CCFE;
  color: #FFF;
}
div.content_form .btn_area button.delete {
  background-color: #DEDEDE;
  color: #333;
}

.error_display_area {
  text-align: left;
}

.project_tag_help {
  text-align: center;
  color: #333;
  font-size: 14px;
}
.project_tag_help h1 {
  margin: 32px 0;
  font-size: 22px;
  font-weight: bold;
}

/*****************************************
 コンテンツ
*****************************************/
div.confirm_form {
  margin-top: 30px;
}
div.confirm_form .inner {
  width: 500px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
div.confirm_form .inner h3 {
  font-size: 20px;
  font-weight: normal;
  line-height: 18px;
  padding: 0;
  margin: 10px;
  color: #333;
}
div.confirm_form .inner img {
  width: 200px;
  height: 200px;
}
div.confirm_form .inner .loading img {
  width: 48px;
  height: 48px;
}
div.confirm_form .inner .content_area {
  border-radius: 6px;
  background-color: #FFF;
  padding: 20px;
  margin-bottom: 20px;
}
div.confirm_form .inner .content_area input {
  margin-bottom: 4px;
}
div.confirm_form .inner .btn_back {
  border-radius: 6px;
  border: 1px solid #CCC;
  height: 50px;
  width: 460px;
  text-align: center;
  vertical-align: middle;
  background-color: #EDEDED;
  color: #666;
  font-size: 20px;
  line-height: 50px;
  margin-bottom: 20px;
  box-sizing: border-box;
}
div.confirm_form .inner .button_area {
  margin-top: 20px;
}
div.confirm_form .inner .button_area .btn_accept,
div.confirm_form .inner .button_area .btn_deny {
  display: inline-block;
  border-radius: 4px;
  width: 160px;
  margin: 0 16px;
  padding: 12px 0;
  color: #fff;
  font-size: 16px;
}
div.confirm_form .inner .button_area .btn_accept {
  background-color: #32cbfd;
}
div.confirm_form .inner .button_area .btn_deny {
  background-color: #ccc;
}
div.confirm_form .inner .btn_accept:hover,
div.confirm_form .inner .btn_deny:hover,
div.confirm_form .inner .btn_submit:hover,
div.confirm_form .inner .btn_back:hover {
  cursor: pointer;
  opacity: 0.7;
}
div.confirm_form .inner .note {
  margin-bottom: 24px;
  font-size: 16px;
}
div.confirm_form .inner .attention {
  font-size: 12px;
  font-weight: normal;
  line-height: 14px;
  color: #666;
}
div.confirm_form .inner .invitation_comment_area {
  text-align: left;
}
div.confirm_form .inner .invitation_comment_area h3 {
  margin: 0;
  font-size: 14px;
}
div.confirm_form .inner .invitation_comment_area .invitation_comment {
  border: 1px solid #ccc;
  border-radius: 4px;
  margin-top: 4px;
  padding: 4px 10px;
  line-height: 24px;
}

/*****************************************
 作品詳細
*****************************************/
div.modal,
div.item_show {
  width: 996px;
  background-color: #FFF;
  padding: 20px 0 20px 20px;
  margin-bottom: 0px;
}
div.modal a:hover img,
div.item_show a:hover img {
  opacity: 0.8;
}
div.modal .item_detail,
div.item_show .item_detail {
  box-sizing: border-box;
  width: 600px;
  float: left;
}
div.modal .item_detail .main_img,
div.item_show .item_detail .main_img {
  margin: 0 0 10px 0;
  width: 600px;
  overflow: hidden;
}
div.modal .item_detail .thumb_img_area,
div.item_show .item_detail .thumb_img_area {
  position: relative;
}
div.modal .item_detail .tag_area dl dt,
div.modal .item_detail .category_area dl dt,
div.modal .item_detail .user_items_area dl dt,
div.modal .item_detail .recommend_users_area dl dt,
div.item_show .item_detail .tag_area dl dt,
div.item_show .item_detail .category_area dl dt,
div.item_show .item_detail .user_items_area dl dt,
div.item_show .item_detail .recommend_users_area dl dt {
  font-size: 18px;
  padding: 5px 0;
}
div.modal .item_detail .category_area,
div.item_show .item_detail .category_area {
  margin-bottom: 10px;
}
div.modal .item_detail .category_area dt,
div.item_show .item_detail .category_area dt {
  font-size: 18px;
  line-height: 20px;
  margin-bottom: 5px;
}
div.modal .item_detail .user_items_area dl dt,
div.item_show .item_detail .user_items_area dl dt {
  font-size: 18px;
  line-height: 20px;
  margin-bottom: 5px;
}
div.modal .item_detail .user_items_area dl dd,
div.item_show .item_detail .user_items_area dl dd {
  width: 135px;
  height: 135px;
  margin-right: 10px;
  text-align: center;
}
div.modal .item_detail .user_items_area dl dd img,
div.item_show .item_detail .user_items_area dl dd img {
  width: 135px;
}
div.modal .item_detail .recommend_users_area dl dt,
div.item_show .item_detail .recommend_users_area dl dt {
  font-size: 18px;
  line-height: 20px;
  margin-bottom: 5px;
}
div.modal .item_detail .recommend_users_area dl dd,
div.item_show .item_detail .recommend_users_area dl dd {
  width: 75px;
  height: 75px;
  margin-right: 10px;
  text-align: center;
}
div.modal .item_detail .recommend_users_area dl dd img,
div.item_show .item_detail .recommend_users_area dl dd img {
  width: 75px;
}
div.modal .item_detail .share_code_area dl,
div.item_show .item_detail .share_code_area dl {
  height: 22px;
}
div.modal .item_detail .share_code_area dt,
div.item_show .item_detail .share_code_area dt {
  float: left;
  font-size: 12px;
  line-height: 22px;
  text-align: right;
  box-sizing: border-box;
  padding-right: 10px;
  width: 50%;
}
div.modal .item_detail .share_code_area dd,
div.item_show .item_detail .share_code_area dd {
  float: right;
  box-sizing: border-box;
  padding-right: 10px;
  width: 50%;
}
div.modal .item_detail .share_code_area input,
div.item_show .item_detail .share_code_area input {
  width: 100%;
  font-size: 12px;
  color: #666;
  line-height: 12px;
  padding: 3px;
  border: 1px solid #CCC;
  height: 22px;
  overflow: hidden;
  box-sizing: border-box;
}
div.modal .item_detail .tool_area dl dt,
div.item_show .item_detail .tool_area dl dt {
  font-size: 18px;
  padding: 5px 0 5px 0;
}
div.modal .item_detail .tool_area dl dd,
div.item_show .item_detail .tool_area dl dd {
  float: left;
  width: 90px;
  height: 90px;
  margin-bottom: 8px;
  background-color: #ddd;
  text-align: center;
}
div.modal .item_detail .tool_area dl dd:hover,
div.item_show .item_detail .tool_area dl dd:hover {
  opacity: 0.8;
}
div.modal .item_detail .tool_area dl dd:not(:last-of-type),
div.item_show .item_detail .tool_area dl dd:not(:last-of-type) {
  margin-right: 10px;
}
div.modal .item_detail .tool_area dl dd a,
div.item_show .item_detail .tool_area dl dd a {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
}
div.modal .item_detail .tool_area dl dd a img,
div.item_show .item_detail .tool_area dl dd a img {
  max-width: 100%;
  max-height: 100%;
}
div.modal .item_detail .tag_label,
div.item_show .item_detail .tag_label {
  display: inline-block;
  padding: 0 6px;
  height: 24px;
  line-height: 24px;
  margin-bottom: 6px;
  border-radius: 3px;
  border: 1px solid #b3d9ff;
  color: #333;
  text-align: center;
}
div.modal .item_detail .tag_label:hover,
div.item_show .item_detail .tag_label:hover {
  opacity: 0.7;
}
div.modal .item_detail .tag_label:not(:last-of-type),
div.item_show .item_detail .tag_label:not(:last-of-type) {
  margin-right: 6px;
}
div.modal .item_detail .tag_label a,
div.item_show .item_detail .tag_label a {
  display: inline-block;
  width: 100%;
  height: 100%;
}
div.modal .item_detail .tag_label a:hover,
div.item_show .item_detail .tag_label a:hover {
  text-decoration: none;
}
div.modal .item_detail .project_tag_area,
div.item_show .item_detail .project_tag_area {
  position: relative;
}
div.modal .item_detail .project_tag_area .project_tag_img_list,
div.item_show .item_detail .project_tag_area .project_tag_img_list {
  overflow: hidden;
}
div.modal .item_detail .project_tag_area .project_tag_img_list dl,
div.item_show .item_detail .project_tag_area .project_tag_img_list dl {
  width: 1000px;
  margin: 0 -10px 0 0;
  position: relative;
  left: 0;
}
div.modal .item_detail .project_tag_area .project_tag_img_list dl dt,
div.item_show .item_detail .project_tag_area .project_tag_img_list dl dt {
  font-size: 18px;
  padding: 5px 0 5px 0;
}
div.modal .item_detail .project_tag_area .project_tag_img_list dl dd,
div.item_show .item_detail .project_tag_area .project_tag_img_list dl dd {
  color: #666;
  margin: 2px 0 4px 0;
}
div.modal .item_detail .project_tag_area .project_tag_img_list dl dd span,
div.item_show .item_detail .project_tag_area .project_tag_img_list dl dd span {
  text-decoration: underline;
}
div.modal .item_detail .project_tag_area .project_tag_img_list .project_tag_imgs,
div.item_show .item_detail .project_tag_area .project_tag_img_list .project_tag_imgs {
  width: 1000px;
  position: relative;
}
div.modal .item_detail .project_tag_area .project_tag_img_list ul li.project_tag_img,
div.item_show .item_detail .project_tag_area .project_tag_img_list ul li.project_tag_img {
  width: 90px;
  height: 90px;
  overflow: hidden;
  margin: 0 5px 5px auto;
  cursor: pointer;
  float: left;
}
div.modal .item_detail .project_tag_area button,
div.item_show .item_detail .project_tag_area button {
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 99;
  font-size: 16px;
  color: #fff;
  width: 36px;
  line-height: 36px;
  cursor: pointer;
  position: absolute;
  top: 25px;
  border-radius: 18px;
}
div.modal .item_detail .project_tag_area .btn_img,
div.item_show .item_detail .project_tag_area .btn_img {
  position: absolute;
  bottom: 40px;
  background-color: rgba(0, 0, 0, 0.6);
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  font-size: 22px;
  color: #fff;
  cursor: pointer;
  z-index: 99;
}
div.modal .item_detail .project_tag_area .btn_img:hover,
div.item_show .item_detail .project_tag_area .btn_img:hover {
  opacity: 0.8;
}
div.modal .item_detail .project_tag_area .btn_img_prev,
div.item_show .item_detail .project_tag_area .btn_img_prev {
  border-radius: 5px 0 0 5px;
  left: -10px;
}
div.modal .item_detail .project_tag_area .btn_img_next,
div.item_show .item_detail .project_tag_area .btn_img_next {
  border-radius: 0 5px 5px 0;
  right: -10px;
}
div.modal .item_detail .user_item_img,
div.item_show .item_detail .user_item_img {
  float: left;
  margin: 0 5px 5px 0;
}
div.modal .item_detail .user_item_img.more,
div.item_show .item_detail .user_item_img.more {
  position: relative;
}
div.modal .item_detail .user_item_img.more span,
div.item_show .item_detail .user_item_img.more span {
  position: absolute;
  bottom: 0px;
  left: 0px;
  color: #0099FF;
  cursor: pointer;
}
div.modal .item_detail .user_item_img.more span:hover,
div.item_show .item_detail .user_item_img.more span:hover {
  text-decoration: underline;
}
div.modal .right_column,
div.item_show .right_column {
  width: 376px;
  position: relative;
  float: right;
}
div.modal .right_column .header_area,
div.item_show .right_column .header_area {
  width: 376px;
}
div.modal .right_column .tracking_area,
div.item_show .right_column .tracking_area {
  width: 376px;
}
div.modal .right_column .user_info_area,
div.item_show .right_column .user_info_area {
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 10px;
  padding: 0 10px;
}
div.modal .right_column .user_info_area .right,
div.item_show .right_column .user_info_area .right {
  padding-top: 2px;
}
div.modal .right_column .user_info_area .right div.btn_follow, div.modal .right_column .user_info_area .right div.IconSetting,
div.item_show .right_column .user_info_area .right div.btn_follow,
div.item_show .right_column .user_info_area .right div.IconSetting {
  float: right;
}
div.modal .right_column .user_info_area .right div.IconSetting,
div.item_show .right_column .user_info_area .right div.IconSetting {
  margin-left: 4px;
  padding-top: 4px;
  width: 30px;
}
div.modal .right_column .user_info_area .avatar img,
div.item_show .right_column .user_info_area .avatar img {
  border-radius: 5px;
  width: 40px;
  float: left;
}
div.modal .right_column .user_info_area .user_name,
div.item_show .right_column .user_info_area .user_name {
  font-size: 14px;
  padding-left: 5px;
  line-height: 40px;
  float: left;
  color: #000;
}
div.modal .right_column .user_info_area .user_name a,
div.item_show .right_column .user_info_area .user_name a {
  color: #000;
}
div.modal .right_column .user_info_area .config_button_area,
div.item_show .right_column .user_info_area .config_button_area {
  display: inline-block;
  float: right;
  margin-left: 4px;
}
div.modal .right_column .title,
div.item_show .right_column .title {
  font-size: 20px;
  line-height: 22px;
  font-weight: normal;
  margin: 0 15px 5px 15px;
}
div.modal .right_column .caption,
div.item_show .right_column .caption {
  font-size: 12px;
  line-height: 16px;
  margin: 0 15px;
  white-space: pre-wrap;
}
div.modal .right_column .title_caption_area,
div.item_show .right_column .title_caption_area {
  background-color: #FFF;
  padding: 10px 0;
}
div.modal .right_column .title_caption_area .icon_lock,
div.item_show .right_column .title_caption_area .icon_lock {
  color: #ffb500;
  padding: 0 5px;
}
div.modal .right_column .title_caption_area .competition_announce,
div.item_show .right_column .title_caption_area .competition_announce {
  background-color: #fdf5da;
  border: 1px solid #ffe594;
  border-radius: 4px;
  margin: -8px 15px 8px 15px;
  padding: 6px;
  line-height: 16px;
  color: #333;
}
div.modal .right_column .social_area,
div.item_show .right_column .social_area {
  color: #999;
  padding: 10px;
  font-size: 12px;
  height: 40px;
}
div.modal .right_column .social_area td,
div.item_show .right_column .social_area td {
  text-align: center;
}
div.modal .right_column .ad_area,
div.item_show .right_column .ad_area {
  margin: 15px auto 0 auto;
  text-align: center;
  width: 336px;
}
div.modal footer.footer_area,
div.item_show footer.footer_area {
  position: fixed;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100px;
  z-index: 999;
  opacity: 1;
  text-align: center;
  padding: 0 auto;
}
div.modal footer.footer_area .footer_container,
div.item_show footer.footer_area .footer_container {
  box-sizing: border-box;
  /*width: 1136px;*/
  width: 996px;
  margin: 0 auto;
}
div.modal footer.footer_area .footer_left_column,
div.item_show footer.footer_area .footer_left_column {
  box-sizing: border-box;
  float: left;
  width: 600px;
}
div.modal footer.footer_area .footer_left_column .thumb_img_area,
div.item_show footer.footer_area .footer_left_column .thumb_img_area {
  position: relative;
}
div.modal footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list,
div.item_show footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list {
  width: 600px;
  overflow: hidden;
}
div.modal footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list ul,
div.item_show footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list ul {
  position: relative;
  width: 1200px;
}
div.modal footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list ul .selected,
div.item_show footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list ul .selected {
  box-sizing: border-box;
  border: 2px solid #00FFFF;
  width: 75px;
  height: 75px;
}
div.modal footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list ul li.thumb_img,
div.item_show footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list ul li.thumb_img {
  width: 80px;
  height: 80px;
  overflow: hidden;
  margin: 0 6px 0 0;
  cursor: pointer;
  float: left;
}
div.modal footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list ul li.thumb_img img,
div.item_show footer.footer_area .footer_left_column .thumb_img_area .thumb_img_list ul li.thumb_img img {
  width: 80px;
  height: 80px;
}
div.modal footer.footer_area .footer_left_column .thumb_img_area .btn_img,
div.item_show footer.footer_area .footer_left_column .thumb_img_area .btn_img {
  position: absolute;
  top: 22px;
  color: #fff;
  font-size: 30px;
  cursor: pointer;
}
div.modal footer.footer_area .footer_left_column .thumb_img_area .btn_img_prev,
div.item_show footer.footer_area .footer_left_column .thumb_img_area .btn_img_prev {
  left: -24px;
}
div.modal footer.footer_area .footer_left_column .thumb_img_area .btn_img_next,
div.item_show footer.footer_area .footer_left_column .thumb_img_area .btn_img_next {
  right: -18px;
}
div.modal footer.footer_area .footer_right_column,
div.item_show footer.footer_area .footer_right_column {
  box-sizing: border-box;
  float: right;
  background-color: #000;
  height: 100px;
  width: 376px;
  color: #FFF;
}
div.modal footer.footer_area .footer_right_column .page_info_area,
div.item_show footer.footer_area .footer_right_column .page_info_area {
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  padding: 5px 12px;
  line-height: 14px;
  color: #FFF;
  text-align: left;
  clear: both;
}
div.modal footer.footer_area .footer_right_column .page_info_area .page_info_sub_area,
div.item_show footer.footer_area .footer_right_column .page_info_area .page_info_sub_area {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-right: 8px;
}
div.modal footer.footer_area .footer_right_column .page_info_area .old_vote_point,
div.item_show footer.footer_area .footer_right_column .page_info_area .old_vote_point {
  font-size: 10px;
  line-height: 14px;
}
div.modal footer.footer_area .footer_right_column .page_info_area .fa-question-circle-o,
div.item_show footer.footer_area .footer_right_column .page_info_area .fa-question-circle-o {
  display: inline-block;
  margin: 0 8px 0 3px;
  font-size: 14px;
  cursor: pointer;
}
div.modal footer.footer_area .footer_right_column .page_info_area .old_point_help,
div.item_show footer.footer_area .footer_right_column .page_info_area .old_point_help {
  text-align: center;
  color: #333;
  font-size: 14px;
}
div.modal footer.footer_area .footer_right_column .page_info_area .old_point_help h1,
div.item_show footer.footer_area .footer_right_column .page_info_area .old_point_help h1 {
  margin: 32px 0;
  font-size: 22px;
  font-weight: bold;
}
div.modal footer.footer_area .footer_right_column .page_info_area .published_at,
div.item_show footer.footer_area .footer_right_column .page_info_area .published_at {
  font-size: 10px;
  line-height: 14px;
  color: #666666;
}
div.modal footer.footer_area .footer_right_column .page_info_area .pv_area,
div.item_show footer.footer_area .footer_right_column .page_info_area .pv_area {
  text-align: right;
}
div.modal footer.footer_area .footer_right_column .page_info_area .pv_area .pv_cnt,
div.item_show footer.footer_area .footer_right_column .page_info_area .pv_area .pv_cnt {
  font-size: 14px;
  line-height: 14px;
  color: #FFF;
}
div.modal footer.footer_area .footer_right_column .btn_area,
div.item_show footer.footer_area .footer_right_column .btn_area {
  height: 30px;
  padding: 0 10px;
}
div.modal footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user,
div.item_show footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user {
  position: absolute;
  bottom: 30px;
  left: 0px;
  z-index: 100;
  overflow: auto;
  box-sizing: border-box;
  max-height: 240px;
  width: 256px;
  box-shadow: 4px 4px 4px 4px rgba(0, 0, 0, 0.4);
  border-radius: 3px;
  background: #fff;
  color: #000;
  text-align: left;
  cursor: auto;
}
div.modal footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user .header,
div.item_show footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user .header {
  font-size: 14px;
  padding: 6px 10px;
}
div.modal footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user ul,
div.item_show footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user ul {
  clear: both;
}
div.modal footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user ul li,
div.item_show footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user ul li {
  border-top: 1px solid #eee;
  color: #000;
  font-size: 12px;
  line-height: 20px;
  padding: 8px 10px;
}
div.modal footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user ul li a,
div.item_show footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user ul li a {
  color: #000;
}
div.modal footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user ul li a img,
div.item_show footer.footer_area .footer_right_column .btn_area .btn_vote .popup_vote_user ul li a img {
  width: 20px;
  height: 20px;
  margin-right: 8px;
}

.footer_area .btn_area .btn_vote:before,
.footer_area .btn_area .btn_favorite:before,
.footer_area .btn_area .btn_twitter:before,
.footer_area .btn_area .btn_fb:before {
  font-size: 14px;
}
.footer_area .btn_area .btn_vote,
.footer_area .btn_area .btn_favorite,
.footer_area .btn_area .btn_twitter,
.footer_area .btn_area .btn_fb {
  border-radius: 3px;
  width: 70px;
  height: 20px;
  margin: 5px 0 0 8px;
  padding-left: 20px;
  line-height: 20px;
  font-size: 12px;
  color: #FFF;
}
.footer_area .btn_area .btn_vote {
  height: 30px;
  width: 120px;
  margin: 0;
  line-height: 30px;
  position: relative;
}

div.modal .right_column {
  width: 390px;
}
div.modal .modal_item_detail {
  height: 100%;
  width: 600px;
  float: left;
}

/*****************************************
 投稿詳細
*****************************************/
div.post_show {
  background-color: #FFF;
  padding: 20px;
}
div.post_show .item_detail {
  box-sizing: border-box;
  width: 600px;
  float: left;
}
div.post_show .item_detail hr {
  margin: 0 -20px;
  border: solid #ededed;
  border-width: 1px 0 0 0;
}
div.post_show .item_detail .post_header {
  margin: 0 0 12px 0;
  width: 600px;
}
div.post_show .item_detail .post_header .icon_area {
  position: relative;
  width: 58px;
  height: 58px;
}
div.post_show .item_detail .post_header .icon_area .main_icon {
  border-radius: 5px;
  width: 58px;
  height: 58px;
}
div.post_show .item_detail .post_header .icon_area .sub_icon {
  position: absolute;
  right: -16px;
  bottom: 4px;
  border: 1px double #fff;
  border-radius: 5px;
  width: 40px;
  height: 40px;
}
div.post_show .item_detail .post_header .name_area {
  width: 380px;
  padding-left: 24px;
}
div.post_show .item_detail .post_header .name_area .name {
  width: 380px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 18px;
  height: 32px;
}
div.post_show .item_detail .post_header .name_area .name a {
  color: #000;
}
div.post_show .item_detail .post_header .name_area .create_at {
  color: #999;
}
div.post_show .item_detail .post_header .config_area {
  width: 140px;
  vertical-align: top;
  text-align: right;
}
div.post_show .item_detail .post_header .config_area .user_info_area {
  width: 138px;
  margin: 0;
}
div.post_show .item_detail .post_header .config_area .public_status {
  display: inline-block;
  color: #ff0000;
  font-weight: bold;
  line-height: 32px;
}
div.post_show .item_detail .post_header .config_area .config_button_area {
  display: inline-block;
}
div.post_show .item_detail .contents_area {
  padding-top: 12px;
}
div.post_show .item_detail .contents_area h2 {
  font-weight: normal;
  margin: 8px 0 12px 0;
}
div.post_show .item_detail .contents_area img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  height: auto;
}
div.post_show .item_detail .contents_area .caption {
  margin: 8px 0 24px 0;
  font-size: 14px;
  white-space: pre-wrap;
}
div.post_show .item_detail .btn_area {
  float: right;
  margin-bottom: 16px;
}
div.post_show .item_detail .share_code_area dl {
  height: 22px;
  margin-bottom: 10px;
}
div.post_show .item_detail .share_code_area dt {
  float: left;
  font-size: 12px;
  line-height: 22px;
  text-align: right;
  box-sizing: border-box;
  padding-right: 10px;
  width: 50%;
}
div.post_show .item_detail .share_code_area dd {
  float: right;
  box-sizing: border-box;
  padding-right: 10px;
  width: 50%;
}
div.post_show .item_detail .share_code_area input {
  width: 100%;
  font-size: 12px;
  color: #666;
  line-height: 12px;
  padding: 3px;
  border: 1px solid #CCC;
  height: 22px;
  overflow: hidden;
  box-sizing: border-box;
}

/*****************************************
 各ページ
*****************************************/
/*****************************************
 ログイン
*****************************************/
div#pg_login .inner .note {
  clear: both;
  font-size: 12px;
  font-weight: normal;
  line-height: 14px;
  text-align: left;
  color: #666;
  padding-top: 7px;
}
div#pg_login .inner .note a {
  color: #0099CC;
}
div#pg_login .inner .attention .title {
  font-size: 18px;
  line-height: 20px;
  font-weight: bold;
  color: #FF0000;
  margin-bottom: 7px;
}
div#pg_login .inner .attention form {
  text-align: left;
  padding-top: 20px;
}
div#pg_login .inner .attention input[type=email] {
  padding: 5px 15px;
  font-size: 14px;
  height: 30px;
  font-weight: normal;
  color: #000;
  border: solid 1px #ccc;
  width: 460px;
  box-sizing: border-box;
  border-radius: 3px;
  float: left;
  margin-right: 5px;
}
div#pg_login .inner .attention .btn_submit {
  border-radius: 6px;
  height: 30px;
  width: 80px;
  text-align: center;
  vertical-align: middle;
  background-color: #32CBFD;
  color: #FFF;
  font-size: 16px;
  line-height: 30px;
  box-sizing: border-box;
  cursor: pointer;
}

/*****************************************
 会員登録
*****************************************/
div#pg_register .inner h2,
div#pg_sns_register .inner h2 {
  font-size: 24px;
}
div#pg_register .inner .user_policy,
div#pg_sns_register .inner .user_policy {
  padding-top: 20px;
  font-weight: normal;
}
div#pg_register .inner .user_policy textarea,
div#pg_sns_register .inner .user_policy textarea {
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  border: solid 1px #333;
}
div#pg_register .inner .note,
div#pg_sns_register .inner .note {
  clear: both;
  font-size: 12px;
  font-weight: normal;
  line-height: 14px;
  text-align: left;
  color: #666;
  padding-top: 7px;
}
div#pg_register .inner .note a,
div#pg_sns_register .inner .note a {
  color: #0099CC;
}
div#pg_register .inner .Description,
div#pg_sns_register .inner .Description {
  font-size: 14px;
  font-weight: normal;
  line-height: 16px;
  text-align: center;
  color: #000;
}
div#pg_register .inner .attention .title,
div#pg_sns_register .inner .attention .title {
  font-size: 18px;
  line-height: 20px;
  font-weight: bold;
  color: #FF0000;
  margin-bottom: 15px;
}
div#pg_register .inner .attention input[type=email],
div#pg_sns_register .inner .attention input[type=email] {
  padding: 5px 15px;
  font-size: 14px;
  height: 30px;
  font-weight: normal;
  color: #000;
  border: solid 1px #ccc;
  width: 460px;
  box-sizing: border-box;
  border-radius: 3px;
  float: left;
  margin-right: 5px;
}
div#pg_register .inner .attention .btn_submit,
div#pg_sns_register .inner .attention .btn_submit {
  border-radius: 6px;
  height: 30px;
  width: 80px;
  text-align: center;
  vertical-align: middle;
  background-color: #32CBFD;
  color: #FFF;
  font-size: 16px;
  line-height: 30px;
  box-sizing: border-box;
  cursor: pointer;
}

/*****************************************
 コンペ詳細
*****************************************/
div#pg_competition h2:not(.item_title) {
  font-size: 20px;
  font-weight: normal;
  line-height: 24px;
  color: #000;
  text-align: left;
  margin: 0 0 16px -2px;
}
div#pg_competition .Inner {
  position: relative;
}
div#pg_competition .Inner h1 {
  margin: 6px 0 18px 0;
  width: 448px;
}
div#pg_competition .Inner a.IconSetting {
  position: absolute;
  top: 16px;
  right: 142px;
  display: block;
}
div#pg_competition .Inner .Gray {
  color: #888888;
}
div#pg_competition .Inner .Description {
  min-height: 48px;
  white-space: pre-wrap;
}
div#pg_competition .Inner .EntryButtonArea {
  margin: 20px 0;
}
div#pg_competition .Inner .EntryButtonArea .Organizer {
  height: 44px;
  width: 200px;
  float: left;
}
div#pg_competition .Inner .EntryButtonArea .Organizer p {
  margin: 4px 0;
  line-height: 16px;
}
div#pg_competition .Inner .EntryButtonArea .EntryButton {
  width: 210px;
  float: left;
}
div#pg_competition .Inner .EntryButtonArea .EntryButton a:hover {
  text-decoration: none;
  opacity: 0.6;
}
div#pg_competition .Inner .EntryButtonArea .MemberNum {
  width: 200px;
  height: 44px;
  line-height: 44px;
  float: left;
  text-align: right;
}
div#pg_competition .Inner .EntryButtonArea .MemberNum span.EntryNum {
  font-size: 20px;
}
div#pg_competition .Inner .ParticipatedMemberArea {
  margin: 0 -15px;
  border-top: 1px solid #cccccc;
}
div#pg_competition .Inner .ParticipatedMemberArea .ParticipatedMemberInner {
  padding: 15px 7px 15px 15px;
}
div#pg_competition .Inner .ParticipatedMemberArea .ParticipatedMemberInner .ParticipatedMemberIconArea {
  margin-top: 12px;
}
div#pg_competition .Inner .ParticipatedMemberArea .ParticipatedMemberInner .ParticipatedMemberIconArea img {
  margin: 0 8px 8px 0;
  width: 36px;
  height: 36px;
}
div#pg_competition .Inner .ClosingRemarksArea {
  margin: 0 -15px;
  min-height: 64px;
  border-top: 1px solid #cccccc;
}
div#pg_competition .Inner .ClosingRemarksArea .ClosingRemarksInner {
  padding: 18px 15px;
}
div#pg_competition .Inner .ClosingRemarksArea .ClosingRemarksInner .ClosingRemarks {
  white-space: pre-wrap;
}
div#pg_competition .Inner .JudgesArea {
  margin: 0 -15px;
  border-top: 1px solid #cccccc;
  padding: 18px 0;
}
div#pg_competition .Inner .JudgesArea .JudgesInner {
  margin: 0 15px;
}
div#pg_competition .Inner .JudgesArea .JudgesInner .JudgeMembersArea {
  margin-top: 16px;
  padding: 0 5px;
}
div#pg_competition .Inner .JudgesArea .JudgesInner .JudgeMembersArea div {
  width: 100px;
  text-align: center;
  float: left;
}
div#pg_competition .Inner .JudgesArea .JudgesInner .JudgeMembersArea div img {
  width: 80px;
  height: 80px;
  margin-bottom: 6px;
}
div#pg_competition .Inner .RegulationToggleButton {
  font-size: 20px;
  color: #35D0E5;
  border: 1px solid #35D0E5;
  border-radius: 8px;
  padding: 8px 12px;
  cursor: pointer;
}
div#pg_competition .Inner .RegulationToggleButton:hover {
  opacity: 0.6;
}
div#pg_competition .Inner .RegulationToggleButton span:after {
  width: 24px;
  height: 24px;
  border: 1px solid #35D0E5;
  border-radius: 50%;
  float: right;
  text-align: center;
  line-height: 26px;
}
div#pg_competition .Inner .RegulationToggleButton.close span:after {
  content: "\25B6";
  font-size: 16px;
}
div#pg_competition .Inner .RegulationToggleButton.open span:after {
  content: "\25BC";
  font-size: 16px;
}
div#pg_competition .Inner .Regulation {
  display: none;
  padding: 12px 4px 2px 4px;
  white-space: pre-wrap;
}
div#pg_competition .Inner .ScheduleSettingButton {
  margin-top: 16px;
  font-size: 20px;
  border: 1px solid #FF3333;
  border-radius: 8px;
  cursor: pointer;
}
div#pg_competition .Inner .ScheduleSettingButton:hover {
  text-decoration: none;
  opacity: 0.6;
}
div#pg_competition .Inner .ScheduleSettingButton a {
  padding: 8px 12px;
  color: #FF3333;
  text-decoration: none;
  display: block;
  height: 100%;
}
div#pg_competition .Inner .ShareArea {
  margin-top: 24px;
  padding: 0 !important;
}
div#pg_competition .Inner .ShareArea .ShareAreaHeader {
  padding: 8px;
  background-color: #3399FF;
  color: #ffffff;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}
div#pg_competition .Inner .ShareArea .Sns, div#pg_competition .Inner .ShareArea .Banner {
  border-style: solid;
  border-color: #3399FF;
  border-width: 8px;
  border-top: none;
  padding: 16px;
}
div#pg_competition .Inner .ShareArea .Sns .ShareType, div#pg_competition .Inner .ShareArea .Banner .ShareType {
  margin-right: 16px;
  float: left;
  width: 92px;
  font-weight: bold;
  text-align: right;
}
div#pg_competition .Inner .ShareArea .Banner .ShareType {
  height: 120px;
  line-height: 120px;
}
div#pg_competition .Inner .ShareArea .Banner .Detail {
  text-align: center;
  float: left;
}
div#pg_competition .Inner .ShareArea .Banner .Detail textarea {
  margin-top: 8px;
  width: 100%;
  height: 92px;
}
div#pg_competition .Inner .ShareArea .Banner img {
  width: 120px;
  height: 120px;
  float: right;
}

/*****************************************
 コンペヘルプ
*****************************************/
div#pg_competition_help {
  background-color: #fff;
  border-radius: 6px;
  width: 640px;
  padding: 16px;
}
div#pg_competition_help .pg_title {
  padding-bottom: 6px;
}

/*****************************************
 コンペ編集
*****************************************/
div#pg_competition_edit .DatePickerArea {
  margin-bottom: 20px;
}
div#pg_competition_edit .DatePickerArea .datetime-picker, div#pg_competition_edit .DatePickerArea .wavedash {
  float: left;
}
div#pg_competition_edit .DatePickerArea .datetime-picker {
  width: 188px;
}
div#pg_competition_edit .DatePickerArea .datetime-picker .mx-datepicker {
  width: 100%;
}
div#pg_competition_edit .DatePickerArea .wavedash {
  width: 56px;
  line-height: 48px;
  height: 48px;
  text-align: center;
}

#pg_contact_finish table {
  margin-top: 30px;
}
#pg_contact_finish table th, #pg_contact_finish table td {
  padding: 16px 0;
  vertical-align: top;
  word-break: normal;
}
#pg_contact_finish table th {
  width: 136px;
}

/*****************************************
 特集一覧
*****************************************/
.feature_unit {
  background-color: #fff;
  box-sizing: border-box;
  border-radius: 4px;
  margin-bottom: 12px;
  padding: 12px;
  width: 640px;
}
.feature_unit .feature_unit_image {
  width: 88px;
  height: 88px;
}
.feature_unit .description_area {
  margin-left: 10px;
  width: 518px;
}
.feature_unit .description_area h3 {
  margin: 2px 0 8px 0;
}

/*****************************************
 全体メッセージ一覧
*****************************************/
div#pg_messages {
  width: 794px;
  float: right;
  box-sizing: border-box;
  padding-left: 20px;
}
div#pg_messages h1 {
  font-size: 22px;
  font-weight: normal;
  line-height: 60px;
  margin: 0;
  padding-left: 15px;
  border-bottom: 1px solid #E2E2E2;
}

/*****************************************
 個別メッセージ一覧
*****************************************/
div#pg_message {
  width: 794px;
  float: right;
  box-sizing: border-box;
  padding-left: 20px;
}
div#pg_message h1 {
  font-size: 22px;
  font-weight: normal;
  line-height: 60px;
  margin: 0;
}

/*****************************************
 メッセージ左カラム
*****************************************/
div.message_left_column {
  float: left;
  width: 200px;
}
div.message_left_column .message_left_area {
  background-color: #FFF;
  border-radius: 6px;
  box-sizing: border-box;
  padding-top: 10px;
  margin-bottom: 20px;
}
div.message_left_column .message_left_area h2 {
  font-size: 16px;
  line-height: 18px;
  font-weight: normal;
  color: #000;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #E2E2E2;
}
div.message_left_column .message_left_area dl {
  box-sizing: border-box;
  width: 200px;
  padding: 10px;
  display: table;
  border-bottom: 1px solid #E2E2E2;
}
div.message_left_column .message_left_area dl dt {
  display: table-cell;
  position: relative;
}
div.message_left_column .message_left_area dl dt img {
  width: 30px;
  height: 30px;
  border-radius: 3px;
}
div.message_left_column .message_left_area dl dt .icon_badge {
  left: 18px;
  top: -7px;
}
div.message_left_column .message_left_area dl dd {
  display: table-cell;
  vertical-align: top;
  padding-left: 10px;
  width: 100%;
}
div.message_left_column .message_left_area dl dd .user_name {
  color: #000;
  font-size: 14px;
  line-height: 16px;
  display: block;
}
div.message_left_column .message_left_area dl dd .date {
  font-size: 12px;
  line-height: 16px;
  color: #CCC;
  text-align: left;
  display: block;
}

/*****************************************
 プロフィール編集
*****************************************/
#pg_profile_edit .mail_controls {
  background-color: #ffbed1;
  text-align: left;
  padding: 16px 8px;
  margin-bottom: 20px;
}
#pg_profile_edit .mail_controls .action {
  padding-top: 6px;
}
#pg_profile_edit .mail_controls .status div {
  display: none;
  padding-top: 6px;
}
#pg_profile_edit .attention .Description {
  margin: 20px 0;
}
#pg_profile_edit .attention table {
  margin-bottom: 20px;
}
#pg_profile_edit .attention table tr:hover {
  background-color: #e9e9e9;
}
#pg_profile_edit .attention table tr td {
  height: 32px;
}
#pg_profile_edit .attention table tr td.web_site_name {
  text-align: left;
}
#pg_profile_edit .attention table tr td.button_area {
  text-align: right;
  width: 100px;
  font-size: 0;
}
#pg_profile_edit .attention table tr td button {
  padding: 0 12px;
  border: 1px solid #ccc;
  border-radius: 3px;
  height: 28px;
  font-size: 12px;
  cursor: pointer;
}
#pg_profile_edit .attention table tr td button.btn_change {
  margin-right: 12px;
}
#pg_profile_edit .attention p {
  margin-bottom: 0;
}
#pg_profile_edit .attention p:not(:last-of-type) {
  margin-bottom: 12px;
}
#pg_profile_edit .attention span {
  color: #FF0000;
}
#pg_profile_edit .attention form {
  text-align: left;
  padding-top: 20px;
}

/*****************************************
 ソーシャル設定
*****************************************/
div#pg_mypage_setting_notification {
  background-color: #fff;
  box-sizing: border-box;
  border-radius: 3px;
  width: 640px;
  margin: 0 auto 20px auto;
  padding: 30px 0;
  text-align: center;
}
div#pg_mypage_setting_notification h2 {
  font-size: 30px;
  font-weight: normal;
  margin-bottom: 10px;
}
div#pg_mypage_setting_notification .setting_area {
  padding: 32px;
}
div#pg_mypage_setting_notification .setting_area h3 {
  text-align: left;
}
div#pg_mypage_setting_notification .setting_area ul li {
  padding-bottom: 10px;
  display: flex;
  align-items: center;
}
div#pg_mypage_setting_notification .setting_area ul li span {
  margin-left: 4px;
}

/*****************************************
 ソーシャル設定
*****************************************/
div#pg_mypage_social {
  background-color: #fff;
  box-sizing: border-box;
  border-radius: 3px;
  width: 640px;
  margin: 0 auto 20px auto;
  padding: 30px 0;
  text-align: center;
}
div#pg_mypage_social h2 {
  font-size: 30px;
  font-weight: normal;
  margin-bottom: 10px;
}
div#pg_mypage_social .social_link_area {
  margin-top: 32px;
}
div#pg_mypage_social .social_link_area .social_link {
  display: block;
  box-sizing: border-box;
  width: 520px;
  line-height: 40px;
  padding: 16px 40px;
  margin: 0 auto;
  border-bottom: 1px solid #ddd;
  font-size: 16px;
  text-align: left;
  clear: both;
  cursor: pointer;
}
div#pg_mypage_social .social_link_area .social_link:first-of-type {
  border-top: 1px solid #ddd;
}
div#pg_mypage_social .social_link_area .social_link:hover {
  background-color: rgba(222, 235, 255, 0.4);
}
div#pg_mypage_social .social_link_area .social_link img {
  border-radius: 50%;
  width: 40px;
  height: 40px;
  margin-right: 6px;
}
div#pg_mypage_social .social_link_area .social_link .status {
  display: inline-block;
  float: right;
  border-radius: 4px;
  width: 120px;
  height: 40px;
  line-height: 40px;
  text-align: center;
}
div#pg_mypage_social .social_link_area .social_link .status.connected {
  background-color: #32cbfd;
  color: #fff;
}
div#pg_mypage_social .social_link_area .social_link .status.not_connect {
  border: 1px solid #ddd;
  background-color: #fff;
  color: #999;
}

/*****************************************
 利用規約
*****************************************/
.terms_message_box {
  border: 1px solid #CCC;
  border-radius: 3px;
  padding: 10px;
  height: 120px;
  font-size: 12px;
  margin-bottom: 20px;
  overflow: auto;
}

div#pg_terms .inner {
  width: 640px;
  box-sizing: border-box;
  background: #fff;
  border-radius: 6px;
  margin-bottom: 20px;
  overflow: hidden;
  position: relative;
  padding: 30px;
}
div#pg_terms .inner .item {
  text-align: left;
  color: #000;
  margin-top: 20px;
  border-radius: 6px;
  background-color: #F5F5F5;
  padding: 15px;
  line-height: 1.5em;
}

div#pg_terms h2,
.terms_message_box h2 {
  font-size: 30px;
  font-weight: normal;
  line-height: 32px;
  text-align: center;
  padding: 0;
  margin: 0 0 20px 0;
}
div#pg_terms li,
.terms_message_box li {
  margin-bottom: 5px;
}
div#pg_terms .definition .list_parentheses,
.terms_message_box .definition .list_parentheses {
  padding: 0 0 0 2em;
  margin: 0;
}
div#pg_terms .definition .list_parentheses li,
.terms_message_box .definition .list_parentheses li {
  list-style-type: none;
  list-style-position: inside;
  counter-increment: cnt;
}
div#pg_terms .definition .list_parentheses li p,
.terms_message_box .definition .list_parentheses li p {
  margin-left: 0;
}
div#pg_terms .definition .list_parentheses li span,
.terms_message_box .definition .list_parentheses li span {
  padding-left: 30px;
}
div#pg_terms .definition .list_parentheses li:before,
.terms_message_box .definition .list_parentheses li:before {
  display: marker;
  content: "(" counter(cnt) ") ";
}
div#pg_terms .term a,
.terms_message_box .term a {
  color: #000000;
  text-decoration: underline;
}
div#pg_terms .term ol.cases,
.terms_message_box .term ol.cases {
  padding-inline-start: 20px;
}
div#pg_terms .term ol.cases li,
.terms_message_box .term ol.cases li {
  list-style-type: none;
}
div#pg_terms .term li,
.terms_message_box .term li {
  padding-bottom: 2px;
  list-style-type: decimal;
}

/*****************************************
 コンテンツ
*****************************************/
div#pg_index .feature_list_link {
  margin: 0 20px 4px 0;
}
div#pg_index h1 {
  font-size: 22px;
  line-height: 60px;
  font-weight: normal;
}
div#pg_index .content_menu_area {
  height: 30px;
  line-height: 30px;
  vertical-align: middle;
}
div#pg_index .content_menu_area ul.item_kind {
  font-size: 14px;
  line-height: 16px;
  list-style-type: none;
  display: inline;
  float: left;
  margin-left: 15px;
}
div#pg_index .content_menu_area ul.item_kind li {
  display: inline;
  color: #CCC;
}
div#pg_index .content_menu_area ul.item_kind li + li:before {
  content: "  |  ";
}
div#pg_index .content_menu_area ul.item_kind li.active {
  font-size: 24px;
}
div#pg_index .content_menu_area ul.item_kind li a {
  color: #4D4D4D;
}
div#pg_index .content_menu_area ul.item_kind li a:hover {
  text-decoration: underline;
}
div#pg_index .content_menu_area_2nd {
  margin-bottom: 10px;
}
div#pg_index .content_menu_area_2nd div.f_r div.f_l {
  margin-left: 28px;
}
div#pg_index ul.item_status {
  display: inline;
  margin-right: 20px;
}
div#pg_index ul.item_status li {
  display: inline-block;
  background-color: #CCCCCC;
  margin-left: 10px;
  padding: 2px 10px;
  border-radius: 10px;
}
div#pg_index ul.item_status li.active {
  background-color: #3399FF;
}
div#pg_index ul.item_status li a {
  cursor: pointer;
  color: #FFF;
}
div#pg_index ul.item_status li a:hover {
  text-decoration: underline;
}
div#pg_index div.sort {
  text-align: right;
}
div#pg_index div.sort ul {
  list-style-type: none;
}
div#pg_index div.sort ul li {
  display: inline-block;
}
div#pg_index div.sort ul li.sort_title {
  color: #999;
  padding-left: 15px;
  padding-right: 5px;
}
div#pg_index div.sort ul li.sort a {
  color: #999;
  cursor: pointer;
}
div#pg_index div.sort ul li.sort a:hover {
  color: #0099FF;
  text-decoration: underline;
}
div#pg_index div.sort ul li.sort.active a {
  color: #0099FF;
}

/*****************************************
 ユーザー一覧
*****************************************/
div#pg_users h1 {
  font-size: 22px;
  font-weight: normal;
  line-height: 24px;
  margin: 0 0 10px 0;
}
div#pg_users form {
  padding: 10px 30px 20px 75px;
  overflow: auto;
}
div#pg_users input[type=text] {
  border: 0;
  padding: 12px 15px;
  font-size: 14px;
  height: 40px;
  font-weight: normal;
  color: #000;
  border: solid 1px #ccc;
  width: 400px;
  box-sizing: border-box;
  border-radius: 6px;
  float: left;
  margin-right: 10px;
}
div#pg_users .btn_submit {
  border-radius: 6px;
  height: 40px;
  width: 80px;
  text-align: center;
  vertical-align: middle;
  background-color: #32CBFD;
  color: #FFF;
  font-size: 16px;
  line-height: 40px;
  box-sizing: border-box;
  cursor: pointer;
}

.pg_external_link_index .warning {
  background-color: #fff;
  box-sizing: border-box;
  border-radius: 6px;
  width: 640px;
  margin: 20px auto;
  padding: 30px;
  text-align: center;
}
.pg_external_link_index .url {
  display: inline-block;
  margin: 24px 0;
  font-size: 16px;
}
.pg_external_link_index .btn_open {
  background-color: #00D2FF;
  display: block;
  box-sizing: border-box;
  border-radius: 4px;
  width: 200px;
  margin: 0 auto;
  padding: 12px;
  text-align: center;
  font-size: 16px;
  color: #fff;
}
.pg_external_link_index .btn_open:hover {
  text-decoration: none;
}
#mg-sp .information_item .bottom_area .author_area {
  max-width: 300px;
}.no_data {
  text-align: left;
  padding: 15px 10px;
}.action-link {
  cursor: pointer;
}
.m-b-none {
  margin-bottom: 0;
}.action-link {
  cursor: pointer;
}
.m-b-none {
  margin-bottom: 0;
}.action-link {
  cursor: pointer;
}
.m-b-none {
  margin-bottom: 0;
}.icon-config {
  text-align: center;
  cursor: pointer;
  color: #AAA;
}#mg-sp .DatePickerArea div input {
  width: 250px !important;
  font-size: 20px;
  padding: 15px 10px;
}.group_list_unit .right_area .unit_name {
  max-width: 336px;
}
.group_list_unit .right_area .description_area_wrap .description_area {
  height: 156px;
}
#mg-sp .group_list_unit .right_area .description_area_wrap .description_area {
  height: 140px;
}.site_link .url_area {
  margin-top: 10px;
}
#mg-sp .site_link .url_area {
  margin-top: 12px;
}
#mg-sp .site_link .bottom_area .author_area {
  max-width: 260px;
}.datetime-picker .mx-datetime-picker-input {
  cursor: pointer;
  margin: 0;
}
.datetime-picker .mx-input-append {
  cursor: pointer;
  right: 2px;
}
#mg-sp .datetime-picker .mx-datetime-picker-input {
  margin: 0;
}.now_loading {
  width: 100%;
  padding: 20px 0 20px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.color_invert img {
  mix-blend-mode: difference;
}.group_invite_menu {
  font-size: 14px;
  font-weight: normal;
  line-height: 18px;
  float: right;
  height: 0;
}
.group_invite_menu a {
  color: #0099FF;
}
#mg-sp .group_invite_menu {
  font-size: inherit;
  line-height: inherit;
}.competition_list_unit .left_area .competition_entry_status {
  margin-bottom: 6px;
}
.competition_list_unit .right_area .unit_name {
  max-width: 448px;
}
.competition_list_unit .right_area .description_area_wrap .description_area {
  height: 188px;
}
#mg-sp .competition_list_unit .left_area .competition_entry_status, #mg-sp .competition_list_unit .competition_status {
  height: 34px;
  line-height: 34px;
  font-size: 18px;
}
#mg-sp .competition_list_unit .right_area .description_area_wrap .description_area {
  height: 176px;
}.modal.file_upload {
  background-color: inherit;
}
.modal.file_upload .modal-container {
  width: 80vw;
  max-width: 1011px;
}
.modal.file_upload .modal-controller {
  width: 80vw;
  max-width: 1011px;
  height: 20px;
}
.modal.file_upload .modal-controller button.btn_modal_close {
  right: -40px;
}
.modal.file_upload .modal-contents {
  width: 80vw;
  max-width: 1011px;
}.comment_area .comment_reply.comment_input_area {
  display: none;
  width: 356px;
}
.comment_area .comment_reply.comment_input_area > div {
  display: table-cell;
  width: 100%;
  vertical-align: top;
}
.comment_area .comment_reply.comment_input_area > div.comment_reply_btn {
  padding-left: 6px;
}
#mg-sp .comment_area .comment_reply.comment_input_area {
  width: 600px;
}
#mg-sp .comment_area .comment_reply.comment_input_area > div.comment_reply_btn {
  padding-left: 10px;
}@charset "UTF-8";
.mypage_notification {
  border-radius: 3px;
  width: 640px;
  height: 100%;
  padding: 10px;
  margin-bottom: 10px;
  box-sizing: border-box;
  /* paddingで幅を変わらないようにする */
  background-color: #ffbed1;
}
#mg-sp .mypage_notification {
  padding: 16px 10px;
  line-height: 36px;
  margin-bottom: 0;
}.site_feed .top_area .blog_head_area {
  width: 500px;
}
.site_feed .top_area .thumb_img_area {
  width: 80px;
  text-align: right;
}
.site_feed .top_area .thumb_img_area .thumb_img {
  width: auto;
  height: auto;
  max-width: 80px;
  max-height: 80px;
}
#mg-sp .site_feed .bottom_area .author_area {
  max-width: 300px;
}.ad_item_list {
  width: 200px;
  height: 200px;
  float: left;
  margin-bottom: 20px;
  margin-right: 20px;
}
.ad_item_detail {
  margin-top: 20px;
}
.ad_top_right {
  margin-bottom: 20px;
}
#mg-sp .ad_item_list {
  width: 314px;
  height: 314px;
  float: left;
  margin: 3px;
}.right_column .ranking_area.module .title_area ul {
  list-style-type: none;
  display: inline;
  float: right;
  font-weight: normal;
  font-size: 12px;
  line-height: 16px;
}
.right_column .ranking_area.module .title_area ul li {
  display: inline;
  color: #CCC;
}
.right_column .ranking_area.module .title_area ul li + li:before {
  content: "|";
  margin: 0 3px;
}
.right_column .ranking_area.module .title_area ul li a {
  color: #999;
}
.right_column .ranking_area.module .title_area ul li.active a {
  color: #0099FF;
}.comment_area {
  text-align: left;
}
.comment_area .comment_display_area {
  background-color: #F6F7F9;
  padding: 6px 10px 0 10px;
  overflow-x: auto;
}
.comment_area .comment_display_area > div {
  padding: 5px;
}
.comment_area .comment_display_area .more {
  display: inline-block;
  margin-top: 8px;
  color: #0099ff;
  cursor: pointer;
}
.comment_area .comment_display_area .more:hover {
  text-decoration: underline;
}
#mg-sp .comment_area .comment_display_area {
  font-size: 30px;
  background-color: #F6F7F9;
  padding: 20px;
}.modal .modal-controller button.btn_modal_prev {
  top: 48%;
  left: -40px;
  border-radius: 10px 0 0 10px;
}
.modal .modal-controller button.btn_modal_next {
  top: 48%;
  right: -1051px;
  border-radius: 0 10px 10px 0;
}div.btn_follow {
  box-sizing: border-box;
  width: 112px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  color: #333;
}
div.btn_follow .btn_follow_inner {
  border-radius: 6px;
}
div.btn_follow .followable {
  background-color: #fff;
  border: 1px solid #dedede;
}
div.btn_follow .followed {
  background-color: #32cbfd;
  border: 1px solid #8be1f8;
  color: #fff;
}
#mg-sp .btn_follow {
  width: 176px;
  height: 48px;
  line-height: 48px;
}input[type=file] {
  display: none;
}
.cropper-content {
  display: flex;
  justify-content: space-between;
}
.cropper-area {
  width: 614px;
  /*width: 100%;*/
}
.actions {
  margin-top: 1rem;
}
.actions .btn-group {
  display: inline-block;
}
.actions .btn-group:not(:last-child) {
  margin-right: 1rem;
  margin-bottom: 1rem;
}
.actions button {
  display: inline-block;
  cursor: pointer;
  padding: 5px 13px;
  background: #0062CC;
  color: white;
  border-radius: 3px;
}
#mg-sp .actions {
  margin-top: 0.6rem;
}.competition_status {
  border-radius: 4px;
  width: 160px;
  height: 26px;
  line-height: 26px;
  text-align: center;
  font-size: 14px;
}
.competition_status.preparing {
  background-color: #eee;
  color: #333;
}
.competition_status.accepting_entry {
  background-color: #ff9900;
  color: #fff;
}
.competition_status.accepting_post {
  background-color: #66CC00;
  color: #fff;
}
.competition_status.confirming {
  background-color: #eee;
  color: #333;
}
.competition_status.voting {
  background-color: #eee;
  color: #333;
}
.competition_status.counting {
  background-color: #eee;
  color: #333;
}
.competition_status.announcement {
  background-color: #ff0000;
  color: #fff;
}.ad_area .ad_count_down {
  position: absolute;
  top: 0;
  left: 0;
  padding: 10px;
  line-height: 18px;
  color: #fff;
  font-size: 18px;
  text-shadow: 1px 1px 3px #000;
  font-weight: normal;
}
.ad_area.item .ad_count_down {
  font-size: 14px;
}
.ad_area .ad_count_down span span {
  padding: 0 4px;
  font-size: 12px;
}
#mg-sp .ad_area .ad_count_down {
  top: 4px;
  left: 4px;
  line-height: 22px;
  font-size: 22px;
}
#mg-sp .ad_area .ad_count_down span span {
  font-size: 16px;
  padding: 0 3px;
}
#mg-sp .ad_area.item .ad_count_down {
  font-size: 22px;
}.competition_entry_button {
  display: block;
  overflow: hidden;
  border-radius: 6px;
  margin: 0 auto;
  width: 200px;
  height: 44px;
  line-height: 44px;
  text-align: center;
  font-size: 14px;
}
.competition_entry_button.preparing, .competition_entry_button.over_enterable_term, .competition_entry_button.over_postable_term, .competition_entry_button.finish {
  background-color: #eee;
  color: #333;
}
.competition_entry_button.login_to_entry, .competition_entry_button.entry, .competition_entry_button.entered, .competition_entry_button.post {
  background-color: #35d0e5;
  color: #fff;
}
.competition_entry_button a {
  display: inline-block;
  width: 100%;
  height: 100%;
  color: #fff;
}
.competition_entry_button a:hover {
  text-decoration: none;
}
#mg-sp .competition_entry_button {
  width: 240px;
  height: 60px;
  line-height: 60px;
  font-size: 22px;
}.group_role_icon {
  position: absolute;
  top: 0;
  left: 0;
  padding: 6px 8px;
  z-index: 1;
}
.group_role_icon i {
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 900;
  color: #ffdd1e;
  text-shadow: 1px 1px 3px #999;
  -webkit-text-stroke: 0.1px #FFF;
}
.group_role_icon i.leader::before {
  content: "\F005";
  font-size: 18px;
}
.group_role_icon i.subleader::before {
  content: "\F123";
  font-size: 18px;
}
.group_role_icon i.member::before {
  content: "\F0C0";
  font-size: 16px;
}
#mg-sp .group_role_icon i.leader::before {
  font-size: 22px;
}
#mg-sp .group_role_icon i.subleader::before {
  font-size: 22px;
}
#mg-sp .group_role_icon i.member::before {
  font-size: 20px;
}.group_join_status {
  top: 10px;
  right: 10px;
  background-color: #32cbfd;
  border-radius: 3px;
  box-sizing: border-box;
  height: 26px;
  line-height: 26px;
  text-align: center;
  color: #fff;
  font-size: 14px;
  z-index: 10;
  cursor: default;
  margin-bottom: 6px;
  width: auto;
}
.group_join_status .login {
  cursor: pointer;
}
.group_join_status .joinable {
  cursor: pointer;
}
.group_join_status .joinable a {
  color: #fff;
}
.group_join_status .joinable a:hover {
  text-decoration: none;
}
.group_join_status .withdrawable {
  background-color: #ff0000;
  border-radius: 3px;
}
.group_join_status .withdrawable:hover {
  background-color: #ff4444;
}
#mg-sp .group_join_status {
  height: 36px;
  line-height: 36px;
  font-size: 20px;
}.competition_role_icon {
  position: absolute;
  top: 0;
  left: 0;
  padding: 6px 8px;
  z-index: 1;
}
.competition_role_icon i {
  padding-right: 4px;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 900;
  color: #ffdd1e;
  text-shadow: 1px 1px 3px #999;
  -webkit-text-stroke: 0.1px #FFF;
}
.competition_role_icon i.organizer::before {
  content: "\F005";
  font-size: 18px;
}
.competition_role_icon i.judge::before {
  content: "\F0E3";
  font-size: 16px;
}
.competition_role_icon i.participated::before {
  content: "\F0C0";
  font-size: 16px;
}
#mg-sp .competition_role_icon i {
  padding-right: 6px;
}
#mg-sp .competition_role_icon i.organizer::before {
  font-size: 22px;
}
#mg-sp .competition_role_icon i.judge::before {
  font-size: 22px;
}
#mg-sp .competition_role_icon i.participated::before {
  font-size: 20px;
}.dropdown-toggle {
  min-height: 40px;
}
.v-select .spinner,
.v-select .spinner:after {
  width: 2.5em !important;
  height: 2.5em !important;
  border-top: 0.4em solid hsla(0, 0%, 39%, 0.1) !important;
  border-right: 0.4em solid hsla(0, 0%, 39%, 0.1) !important;
  border-bottom: 0.4em solid hsla(0, 0%, 39%, 0.1) !important;
  border-left: 0.4em solid rgba(60, 60, 60, 0.45) !important;
}
#mg-sp .v-select {
  background-color: #FFF;
}
#mg-sp .v-select .dropdown-toggle {
  min-height: 70px;
}
#mg-sp .v-select .selected-tag {
  max-height: 60px;
}
#mg-sp .v-select input[type=search] {
  width: 0;
}.right_column .news_area.module {
  overflow: visible;
}
.right_column .news_area.module .news_list .news_item {
  border-bottom: 1px solid #E2E2E2;
  position: relative;
  clear: both;
}
.right_column .news_area.module .news_list .news_item .news_desc_area {
  width: 210px;
  float: left;
  height: 120px;
  display: table;
}
.right_column .news_area.module .news_list .news_item .news_desc_area .inner {
  padding-left: 10px;
  display: table-cell;
  box-sizing: border-box;
  vertical-align: middle;
}
.right_column .news_area.module .news_list .news_item .news_thumbs {
  width: 120px;
  height: 120px;
  overflow: hidden;
  float: right;
}
.right_column .news_area.module .news_list .news_item .news_thumbs img {
  position: relative;
  top: 50%;
  left: 50%;
  width: auto;
  height: 100%;
  transform: translate(-50%, -50%);
  -o-object-fit: cover;
     object-fit: cover;
  width: 120px;
  height: 120px;
}.right_column .hot_competition_area .hot_competition_list_area {
  width: 316px;
  padding-left: 10px;
}
.right_column .hot_competition_area .hot_competition_list_area .hot_competition_unit {
  margin-bottom: 10px;
  text-align: left;
}
.right_column .hot_competition_area .hot_competition_list_area .hot_competition_unit .competition_img_icon_area {
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
}
.right_column .hot_competition_area .hot_competition_list_area .hot_competition_unit .competition_info_area {
  float: left;
  margin-left: 6px;
  width: 230px;
}
.right_column .hot_competition_area .hot_competition_list_area .hot_competition_unit .competition_info_area .competition_name {
  margin: 0;
  font-size: 16px;
  font-weight: normal;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.right_column .hot_competition_area .hot_competition_list_area .hot_competition_unit .competition_info_area .number_of_members {
  display: block;
  margin-top: 18px;
  font-size: 12px;
}
.right_column .hot_competition_area .hot_competition_list_area .hot_competition_unit .competition_info_area .number_of_members em {
  font-size: 16px;
  font-style: normal;
}
.right_column .hot_competition_area .hot_competition_list_area .hot_competition_unit .competition_info_area .members_area {
  margin-top: 4px;
}
.right_column .hot_competition_area .hot_competition_list_area .hot_competition_unit .competition_info_area .members_area a {
  display: inline-block;
  margin: 0 4px 0 0;
}
.right_column .hot_competition_area .hot_competition_list_area .hot_competition_unit .competition_info_area .members_area a img {
  width: 20px;
  height: 20px;
}.right_column .hot_group_area .hot_group_list_area {
  width: 316px;
  padding-left: 10px;
}
.right_column .hot_group_area .hot_group_list_area .hot_group_unit {
  margin-bottom: 10px;
  text-align: left;
}
.right_column .hot_group_area .hot_group_list_area .hot_group_unit .group_img_icon_area {
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80px;
  height: 80px;
}
.right_column .hot_group_area .hot_group_list_area .hot_group_unit .group_info_area {
  float: left;
  margin-left: 6px;
  width: 230px;
}
.right_column .hot_group_area .hot_group_list_area .hot_group_unit .group_info_area .group_name {
  margin: 0;
  font-size: 16px;
  font-weight: normal;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.right_column .hot_group_area .hot_group_list_area .hot_group_unit .group_info_area .number_of_members {
  display: block;
  margin-top: 18px;
  font-size: 12px;
}
.right_column .hot_group_area .hot_group_list_area .hot_group_unit .group_info_area .number_of_members em {
  font-size: 16px;
  font-style: normal;
}
.right_column .hot_group_area .hot_group_list_area .hot_group_unit .group_info_area .members_area {
  margin-top: 4px;
}
.right_column .hot_group_area .hot_group_list_area .hot_group_unit .group_info_area .members_area a {
  display: inline-block;
  margin: 0 4px 0 0;
}
.right_column .hot_group_area .hot_group_list_area .hot_group_unit .group_info_area .members_area a img {
  width: 20px;
  height: 20px;
}@charset "UTF-8";
div.modal-img .modal-img-mask {
  position: fixed;
  z-index: 9000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  /*　半透明　*/
  display: table;
  transition: opacity 0.3s ease;
  cursor: pointer;
}
div.modal-img .modal-img-wrapper {
  display: table-cell;
  vertical-align: middle;
}
div.modal-img .modal-img-scrollbar {
  height: 100vh;
  width: 100vw;
  overflow: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
div.modal-img .modal-img-container {
  margin: 30px;
  display: inline-block;
}
div.modal-img .modal-img-window {
  display: inline-block;
}
div.modal-img .modal-img-contents {
  border-radius: 10px;
  box-sizing: border-box;
  padding: 20px;
  background-color: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);
  display: inline-block;
}.right_item_area {
  z-index: 90;
  position: relative;
  left: 993px;
  width: 60px;
  margin-left: 10px;
}
.right_item_area .right_items {
  position: fixed;
  top: 30%;
}
.right_item_area div.btn_right_items {
  position: absolute;
  z-index: 99;
  box-sizing: border-box;
  height: 24px;
  width: 24px;
  font-size: 22px;
  color: #fff;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.6);
  cursor: pointer;
}
.right_item_area div.btn_right_items:hover {
  opacity: 0.8;
}
.right_item_area div.btn_right_items_prev {
  top: -26px;
  left: 18px;
  border-radius: 5px 5px 0 0;
}
.right_item_area div.btn_right_items_next {
  top: 362px;
  left: 18px;
  padding-top: -2px;
  border-radius: 0 0 5px 5px;
}.important_alert .alert_area {
  background-color: #ffbed1;
  height: 60px;
  display: flex;
}
.important_alert .alert_area .container {
  display: flex;
  align-items: center;
}
.important_alert .alert_area .message {
  flex-basis: 70%;
}
.important_alert .alert_area .controller {
  flex-basis: 30%;
  text-align: right;
}
.important_alert .alert_area .controller button {
  color: #14171a;
  font-size: 13px;
  padding: 5px 11px;
  background-color: #f5f8fa;
  border: 1px solid #e6ecf0;
  border-radius: 4px;
  cursor: pointer;
  display: inline-block;
  font-weight: bold;
  line-height: normal;
}
#mg-sp .important_alert .alert_area {
  width: 640px;
  padding: 10px;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  height: inherit;
  line-height: inherit;
  box-sizing: border-box;
}
#mg-sp .important_alert .alert_area .message {
  flex-basis: 72%;
}
#mg-sp .important_alert .alert_area .controller {
  flex-basis: 28%;
}
#mg-sp .important_alert .alert_area .controller button {
  font-size: 14px;
  padding: 4px 16px;
  margin: 2px 0;
}
#mg-sp .important_alert .margin_area {
  height: 88px;
}.comment_area dl {
  display: table;
}
.comment_area dl dt {
  display: table-cell;
  padding: 3px;
}
.comment_area dl dt img {
  width: 32px;
  height: 32px;
}
.comment_area dl dd {
  display: table-cell;
  vertical-align: top;
  padding: 3px 0 3px 3px;
  width: 100%;
}
.comment_area dl dd .comment_row {
  width: 200px;
}
.comment_area dl dd .date {
  font-size: 10px;
  line-height: 14px;
  color: #999;
  text-align: left;
}
.comment_area dl dd .user_name {
  color: #3F73B6;
  font-weight: bold;
}
.comment_area dl dd .body {
  white-space: pre-wrap;
}
.comment_area dl dd .name_area {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.comment_area dl dd .action_area {
  padding: 3px;
}
.comment_area dl dd .action_area a.btn_login,
.comment_area dl dd .action_area .btn_like,
.comment_area dl dd .action_area .btn_reply {
  color: #3F73B6;
  cursor: pointer;
}
.comment_area dl dd .reply_area .btn_reply_message,
.comment_area dl dd .reply_area .btn_reply_cnt {
  color: #3F73B6;
  cursor: pointer;
}
.comment_area dl dd input[type=text] {
  box-sizing: border-box;
  width: 100%;
  line-height: 24px;
}
#mg-sp .comment_area dl dt {
  padding: 5px;
}
#mg-sp .comment_area dl dt img {
  width: 60px;
  height: 60px;
}
#mg-sp .comment_area dl dd {
  font-size: 24px;
  line-height: 32px;
  padding: 5px 5px;
}
#mg-sp .comment_area dl dd .date {
  font-size: 20px;
  line-height: 26px;
}.btn_fb {
  width: 95px;
  height: 44px;
  background-color: #395596;
  color: #FFF;
  font-size: 16px;
  display: block;
  position: relative;
  float: left;
  box-sizing: border-box;
  border-radius: 6px;
  line-height: 44px;
  margin: 0 0 0 12px;
  padding-left: 20px;
  text-align: center;
  cursor: pointer;
}
.btn_fb:visited, .btn_fb:hover {
  color: #fff;
  text-decoration: none;
}
.btn_fb::before {
  position: absolute;
  top: auto;
  bottom: auto;
  left: 12%;
  font-family: FontAwesome;
  font-size: 22px;
}
.btn_fb:hover::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  background-color: #fff;
  opacity: 0.2;
  z-index: 999;
}
.btn_fb::before {
  content: "\F09A";
}
#mg-sp .btn_fb {
  width: 128px;
  height: 48px;
  border-radius: 6px;
  line-height: 48px;
  padding-left: 24px;
  font-size: 24px;
}
#mg-sp .btn_fb::before {
  left: 12%;
  font-size: 24px;
}.btn_favorite {
  width: 95px;
  height: 44px;
  background-color: #ff99cc;
  color: #FFF;
  font-size: 16px;
  display: block;
  position: relative;
  float: left;
  box-sizing: border-box;
  border-radius: 6px;
  line-height: 44px;
  margin: 0 0 0 12px;
  padding-left: 20px;
  text-align: center;
  cursor: pointer;
}
.btn_favorite:visited, .btn_favorite:hover {
  color: #fff;
  text-decoration: none;
}
.btn_favorite::before {
  position: absolute;
  top: auto;
  bottom: auto;
  left: 12%;
  font-family: FontAwesome;
  font-size: 22px;
}
.btn_favorite:hover::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  background-color: #fff;
  opacity: 0.2;
  z-index: 999;
}
.btn_favorite::before {
  content: "\F005";
}
#mg-sp .btn_favorite {
  width: 128px;
  height: 48px;
  border-radius: 6px;
  line-height: 48px;
  padding-left: 24px;
  font-size: 24px;
}
#mg-sp .btn_favorite::before {
  left: 12%;
  font-size: 24px;
}.btn_twitter {
  width: 95px;
  height: 44px;
  background-color: #0099ff;
  color: #FFF;
  font-size: 16px;
  display: block;
  position: relative;
  float: left;
  box-sizing: border-box;
  border-radius: 6px;
  line-height: 44px;
  margin: 0 0 0 12px;
  padding-left: 20px;
  text-align: center;
  cursor: pointer;
}
.btn_twitter:visited, .btn_twitter:hover {
  color: #fff;
  text-decoration: none;
}
.btn_twitter::before {
  position: absolute;
  top: auto;
  bottom: auto;
  left: 12%;
  font-family: FontAwesome;
  font-size: 22px;
}
.btn_twitter:hover::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  background-color: #fff;
  opacity: 0.2;
  z-index: 999;
}
.btn_twitter::before {
  content: "\F099";
}
#mg-sp .btn_twitter {
  width: 128px;
  height: 48px;
  border-radius: 6px;
  line-height: 48px;
  padding-left: 24px;
  font-size: 24px;
}
#mg-sp .btn_twitter::before {
  left: 12%;
  font-size: 24px;
}.ad_area {
  position: relative;
  overflow: hidden;
}
.ad_area:not(.item) {
  margin-bottom: 20px;
}
.ad_area .ad_pr::before {
  content: "";
  position: absolute;
  z-index: 100;
  top: 0;
  right: 0;
  border-bottom: 3em solid transparent;
  border-right: 3em solid #ff0000;
}
.ad_area .ad_pr::after {
  content: "PR";
  display: block;
  position: absolute;
  z-index: 101;
  top: 5px;
  right: 4px;
  transform: rotate(45deg);
  color: #fff;
}
.ad_area h2 {
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  width: 100%;
  text-align: center;
  color: #fff;
  text-shadow: 1px 1px 3px #000;
  font-weight: normal;
  font-size: 16px;
  padding: 4px 6px;
  line-height: 18px;
  overflow: visible !important;
  white-space: normal !important;
  text-overflow: clip !important;
}
.ad_bottom {
  margin-bottom: 20px;
  background-color: #FFF;
  border-radius: 6px;
  text-align: center;
  padding: 20px;
}
#mg-sp .ad_area:not(.item) h2 {
  padding: 8px;
  line-height: 26px;
  font-size: 22px;
}.btn_vote {
  width: 95px;
  height: 44px;
  background-color: #32cbfd;
  color: #FFF;
  font-size: 16px;
  display: block;
  position: relative;
  float: left;
  box-sizing: border-box;
  border-radius: 6px;
  line-height: 44px;
  margin: 0 0 0 12px;
  padding-left: 20px;
  text-align: center;
  cursor: pointer;
}
.btn_vote:visited, .btn_vote:hover {
  color: #fff;
  text-decoration: none;
}
.btn_vote::before {
  position: absolute;
  top: auto;
  bottom: auto;
  left: 12%;
  font-family: FontAwesome;
  font-size: 22px;
}
.btn_vote:hover::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  background-color: #fff;
  opacity: 0.2;
  z-index: 999;
}
.btn_vote::before {
  content: "\F164";
}
.btn_vote.btn_vote_competition::before {
  content: "\F00C";
}
#mg-sp .btn_vote {
  width: 128px;
  height: 48px;
  border-radius: 6px;
  line-height: 48px;
  padding-left: 24px;
  font-size: 24px;
}
#mg-sp .btn_vote::before {
  left: 12%;
  font-size: 24px;
}.window_notification {
  display: none;
  position: absolute;
  top: 26px;
  right: -40px;
  background-color: #fff;
  border-radius: 6px;
  box-sizing: border-box;
  height: 400px;
  width: 200px;
  text-align: left;
  color: #333;
  z-index: 100;
  font-size: 10px;
  line-height: 12px;
  box-shadow: 0px 0px 3px 3px rgba(0, 0, 0, 0.15);
}
.window_notification.open {
  display: block;
}
.window_notification .window_notification_inner {
  overflow-y: auto;
  height: 100%;
}
.window_notification .window_notification_inner .notification_area {
  padding: 8px 12px;
}
.window_notification .window_notification_inner .notification_area:not(:last-of-type) {
  border-bottom: solid 1px #CCC;
}
.window_notification .window_notification_inner .notification_area.unread {
  background-color: #E8F6FF;
}
.window_notification .window_notification_inner .notification_area:hover {
  background-color: #daf6ff;
}
.window_notification .window_notification_inner .notification_area a {
  font-weight: bold;
}
.window_notification .window_notification_inner .notification_area a img {
  width: 16px;
}
.window_notification .icon_close {
  width: 18px;
  height: 18px;
  cursor: pointer;
  position: absolute;
  top: -10px;
  right: -26px;
}
#mg-sp .window_notification {
  top: 52px;
  right: -160px;
  height: 800px;
  width: 520px;
  z-index: 999;
  font-size: inherit;
  line-height: inherit;
}
#mg-sp .window_notification .window_title {
  float: left;
  margin-bottom: 24px;
  font-size: 28px;
}
#mg-sp .window_notification .icon_close {
  top: -20px;
  right: -20px;
}
#mg-sp .window_notification .icon_close img {
  width: 48px;
  height: 48px;
}
#mg-sp .window_notification .notification_area img {
  width: 32px;
}.comment_area .comment_input_area {
  box-sizing: border-box;
  padding: 6px 9px 6px 7px;
}
.comment_area .comment_input_area .comment_avater {
  width: 30px;
  box-sizing: border-box;
  text-align: center;
}
.comment_area .comment_input_area .comment_avater img {
  box-sizing: border-box;
  border: 1px solid #CCC;
  width: 30px;
  height: 30px;
}
.comment_area .comment_input_area textarea {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid #ccc;
  font-size: 12px;
  line-height: 14px;
  padding: 7px;
  height: 30px;
  margin: 0;
}
.comment_area .comment_input_area button {
  box-sizing: border-box;
  border-radius: 3px;
  border: 1px solid #A9A9A9;
  background-color: #FFF;
  font-size: 14px;
  line-height: 30px;
  color: #333;
  width: 60px;
  padding: 0;
  height: 30px;
  box-sizing: border-box;
  cursor: pointer;
}
.comment_area .comment_login {
  border-radius: 3px;
  box-sizing: border-box;
  border: 1px solid #666;
  background-color: #333;
  font-size: 14px;
  line-height: 29px;
  text-align: center;
}
.comment_area .comment_login a {
  color: #0099FF;
}
#mg-sp .comment_area .comment_input_area {
  padding: 7px 10px;
}
#mg-sp .comment_area .comment_input_area .comment_avater {
  width: 70px;
}
#mg-sp .comment_area .comment_input_area .comment_avater img {
  width: 70px;
  height: 70px;
}
#mg-sp .comment_area .comment_input_area textarea {
  font-size: 22px;
  padding: 10px 4px;
  height: 70px;
}
#mg-sp .comment_area .comment_input_area button {
  font-size: 26px;
  width: 120px;
  height: 70px;
  line-height: 70px;
}
#mg-sp .comment_area .comment_login {
  padding: 14px 0;
  font-size: 28px;
}.message_area dl.comment_input_area {
  position: fixed;
  bottom: 0;
  padding: 10px;
  background-color: #F6F7F9;
  display: table;
  border-top: 1px solid #CCC;
  box-sizing: border-box;
  width: 774px;
}
.message_area dl.comment_input_area dt {
  display: table-cell;
  padding: 5px;
}
.message_area dl.comment_input_area dt img {
  height: 60px;
  width: 60px;
  border-radius: 6px;
}
.message_area dl.comment_input_area dd {
  display: table-cell;
  vertical-align: top;
  padding: 5px;
}
.message_area dl.comment_input_area dd .user_name {
  color: #3F73B6;
  font-size: 14px;
  line-height: 16px;
  font-weight: bold;
  display: block;
  margin-bottom: 5px;
}
.message_area dl.comment_input_area dd input[type=text], .message_area dl.comment_input_area dd textarea {
  font-size: 12px;
  line-height: 14px;
  width: 540px;
  height: 60px;
  padding: 5px;
  box-sizing: border-box;
}
.message_area .comment_submit button {
  box-sizing: border-box;
  border-radius: 3px;
  border: 1px solid #A9A9A9;
  background-color: #FFF;
  font-size: 14px;
  color: #333;
  width: 120px;
  height: 60px;
  line-height: 60px;
}
#mg-sp .message_area dl.comment_input_area {
  background-color: #0099FF;
  width: 100%;
}
#mg-sp .message_area dl.comment_input_area dt img {
  height: 90px;
  width: 90px;
  border-radius: 3px;
}
#mg-sp .message_area dl.comment_input_area dd .user_name {
  font-size: 24px;
  line-height: 26px;
}
#mg-sp .message_area dl.comment_input_area dd input[type=text], #mg-sp .message_area dl.comment_input_area dd textarea {
  font-size: 26px;
  line-height: 28px;
  height: 90px;
  width: inherit;
  padding: 15px;
}
#mg-sp .message_area .comment_submit button {
  border-radius: 6px;
  border: 1px solid #CCC;
  font-size: 26px;
  width: 130px;
  height: 90px;
  line-height: 90px;
}.information_card {
  background-color: #fff;
  border-radius: 8px;
  margin-bottom: 20px;
  padding: 16px;
}
.information_card .top_area .title_area .title {
  margin: 0;
  font-size: 18px;
}
.information_card .top_area .content_area {
  white-space: pre-wrap;
  margin-top: 8px;
  line-height: 16px;
}
.information_card .bottom_area {
  position: relative;
  margin-top: 12px;
}
.information_card .bottom_area .author_area {
  float: left;
  position: absolute;
  bottom: 0;
}
.information_card .bottom_area .author_area .avatar {
  margin-right: 2px;
  width: 30px;
  height: auto;
}
.information_card .bottom_area .information_area {
  float: right;
  margin-top: 12px;
  text-align: right;
}
.information_card .bottom_area .information_area p {
  margin: 6px 0 0 0;
}
.information_card.index {
  margin-bottom: 36px;
}
.information_card.index .top_area .title_area .title {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.information_card.index .top_area .content_area {
  position: relative;
  overflow: hidden;
  height: 56px;
}
.information_card.index .top_area .content_area::after {
  position: absolute;
  left: 0;
  bottom: 0;
  content: "";
  width: 100%;
  height: 36%;
  background: linear-gradient(to top, #fff, transparent);
}

/** for sp **/
#mg-sp .information_card {
  font-size: 18px;
  line-height: 24px;
}
#mg-sp .information_card .top_area .title_area .title {
  font-size: 20px;
  line-height: 24px;
}
#mg-sp .information_card .top_area .content_area {
  margin-top: 10px;
  line-height: 20px;
}
#mg-sp .information_card .bottom_area {
  font-size: 16px;
}
#mg-sp .information_card .bottom_area .author_area {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#mg-sp .information_card .bottom_area .author_area .avatar {
  width: 36px;
}
#mg-sp .information_card .bottom_area .information_area {
  margin-top: 12px;
}
#mg-sp .information_card .bottom_area .information_area p {
  margin: 0;
}
#mg-sp .information_card.index {
  margin-bottom: 20px;
}
#mg-sp .information_card.index .top_area .content_area {
  height: 64px;
}.right_column .ranking_area.module .tab_ranking_content {
  padding: 0 8px 8px 8px;
  clear: both;
}
.right_column .ranking_area.module .tab_ranking_content .ranking_explain {
  border-radius: 3px;
  height: 36px;
  line-height: 36px;
  background-color: #3C3A3B;
  color: #FFF;
  margin-bottom: 5px;
  vertical-align: middle;
  padding-left: 10px;
}
.right_column .ranking_area.module .tab_ranking_content .ranking_explain ul {
  list-style-type: none;
  display: inline;
  float: right;
  margin-right: 9px;
}
.right_column .ranking_area.module .tab_ranking_content .ranking_explain ul li {
  display: inline;
  vertical-align: middle;
}
.right_column .ranking_area.module .tab_ranking_content .ranking_explain ul li img {
  vertical-align: middle;
  display: inline;
  margin-left: 5px;
  margin-right: 3px;
}
.right_column .ranking_area.module .tab_ranking_content .ranking_list .item {
  float: left;
  width: 150px;
  height: 150px;
  margin: 5px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.right_column .ranking_area.module .tab_ranking_content .ranking_list .item h2 {
  position: absolute;
  left: 0px;
  bottom: 0px;
  background-color: rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  padding: 4px 6px;
  width: 150px;
  line-height: 16px;
  text-align: center;
  color: #fff;
  font-size: 14px;
  text-shadow: 1px 1px 3px #000;
  font-weight: normal;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.right_column .ranking_area.module .ranking_list .no_data_ranking {
  padding: 10px 0 5px 2px;
}
.right_column .ranking_area.module .ranking_more {
  height: 30px;
  line-height: 30px;
  margin: 5px 0;
  float: left;
  width: 100%;
  text-align: center;
}
.right_column .ranking_area.module .ranking_more a {
  display: inline-block;
  background-color: #35d0e5;
  color: #FFF;
  width: 100%;
  border-radius: 3px;
}@charset "UTF-8";
.modal .modal-mask {
  position: fixed;
  z-index: 8000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  /*　半透明　*/
  display: table;
  transition: opacity 0.3s ease;
}
.modal .modal-wrapper {
  display: table-cell;
  vertical-align: middle;
}
.modal .modal-scrollbar {
  height: 100vh;
  overflow-y: auto;
}
.modal .modal-container {
  width: 1011px;
  margin: 30px auto 100px auto;
  position: relative;
}
.modal .modal-window {
  width: 1011px;
}
.modal .modal-controller {
  height: 100%;
  position: fixed;
  top: 30px;
}
.modal .modal-controller button {
  background-color: white;
  z-index: 8999;
  font-size: 16px;
  color: #666;
  width: 36px;
  line-height: 36px;
  cursor: pointer;
  position: absolute;
}
.modal .modal-controller button:hover {
  color: #999;
}
.modal .modal-controller button.btn_modal_close {
  border-radius: 8px;
  font-weight: bold;
  top: -15px;
  right: -1051px;
}
.modal .modal-contents {
  border-radius: 10px;
  box-sizing: border-box;
  width: 1011px;
  padding: 20px 0px 20px 20px;
  background-color: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);
}
#mg-sp .modal .modal-container {
  margin: 0 auto;
  width: 540px;
}
#mg-sp .modal .modal-controller .btn_modal_close {
  top: 72px;
  right: -580px;
  width: 44px;
  height: 44px;
  font-size: 28px;
}
#mg-sp .modal .modal-contents {
  border-radius: 10px;
  margin: 0 auto;
  padding: 20px;
  width: 100%;
  height: 640px !important;
}.list_card {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  background: #fff;
  border-radius: 6px;
  width: 200px;
  min-height: 120px;
  margin-bottom: 20px;
  padding: 6px;
}
.list_card.empty {
  width: 200px;
  height: 0;
  min-height: 0;
  padding: 0;
}
.list_card .avatar {
  border: 2px solid #fff;
  width: 60px;
  height: 60px;
}
.list_card .avatar img {
  width: 100%;
  height: 100%;
}
.list_card .follows_area {
  margin: 2px;
}
.list_card .follows_area .btn_follow {
  width: 96px;
  height: 22px;
  line-height: 22px;
  font-size: 11px;
}
.list_card .follows_area .follows_num {
  margin: 6px 2px 0 0;
}
.list_card .follows_area .follows_num a {
  color: #999;
}
.list_card .name_area {
  margin: 4px;
}
.list_card .name_area span {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 0;
  max-width: 180px;
}
.list_card .name_area .nickname {
  margin-bottom: 2px;
  font-size: 14px;
  font-weight: bold;
}
.list_card .name_area .name {
  font-size: 12px;
}
#mg-sp .list_card {
  width: 308px;
  min-height: 204px;
}
#mg-sp .list_card.empty {
  width: 200px;
  min-height: 0;
}
#mg-sp .list_card:nth-of-type(odd) {
  margin: 0 8px 20px 4px;
}
#mg-sp .list_card:nth-of-type(even) {
  margin: 0 4px 20px 8px;
}
#mg-sp .list_card .avatar {
  width: 120px;
  height: 120px;
}
#mg-sp .list_card .follows_area .btn_follow {
  width: 148px;
  height: 40px;
  line-height: 40px;
  font-size: 18px;
}
#mg-sp .list_card .follows_area .follows_num {
  margin: 12px 4px 0 0;
}
#mg-sp .list_card .name_area {
  margin: 8px 4px 0 0;
}
#mg-sp .list_card .name_area span {
  max-width: 296px;
}
#mg-sp .list_card .name_area .nickname {
  font-size: 24px;
}
#mg-sp .list_card .name_area .name {
  font-size: 18px;
}.modal_search_amazon {
  padding: 0 !important;
}
.modal_search_amazon .modal-container {
  width: 480px !important;
  padding: 0;
}
.modal_search_amazon .modal-container .modal-contents {
  float: right;
  width: 480px;
  display: block;
  z-index: 9999;
  border-radius: 6px;
  background-color: #FFF;
  padding: 10px 0 0 0;
  border: 1px solid #EDEDED;
  box-sizing: border-box;
}
.modal_search_amazon .modal-container .modal-contents .window_title {
  font-size: 16px;
  margin-bottom: 8px;
  padding-bottom: 8px;
  color: #000;
  text-align: center;
  border-bottom: 1px solid #EDEDED;
  box-sizing: border-box;
}
.modal_search_amazon .modal-container .modal-contents .item_list {
  padding-left: 10px;
  padding-right: 10px;
}
.modal_search_amazon .modal-container .modal-contents .item_list .item_list_area {
  position: absolute;
  top: 104px;
  bottom: 0;
  left: 0;
  right: 0;
  overflow-y: auto;
}
.modal_search_amazon .modal-container .modal-contents .item_list .amazon_item_list .amazon_item {
  border-bottom: 1px solid #EDEDED;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
}
.modal_search_amazon .modal-container .modal-contents .item_list .amazon_item_list .amazon_item:last-child {
  border: none;
}
.modal_search_amazon .modal-container .modal-contents .item_list .amazon_item_list .amazon_item:hover {
  background-color: #c6f0ff;
  cursor: pointer;
}
.modal_search_amazon .modal-container .modal-contents .item_list .amazon_item_list .amazon_item .item_image {
  text-align: center;
  overflow: hidden;
  float: left;
  width: 20%;
  height: 48px;
}
.modal_search_amazon .modal-container .modal-contents .item_list .amazon_item_list .amazon_item .item_image img {
  margin: 0 10px;
  width: auto;
  height: 100%;
}
.modal_search_amazon .modal-container .modal-contents .item_list .amazon_item_list .amazon_item .amazon_item_name {
  width: 80%;
  float: left;
  line-height: 16px;
  text-align: left;
  font-size: 12px;
  color: #000;
  padding: 0 10px;
}
.modal_search_amazon .modal-container .modal-contents .window_bottom {
  clear: both;
  border-top: 1px solid #EDEDED;
  background-color: #fff;
  padding: 10px;
  box-sizing: border-box;
  position: absolute;
  bottom: 0;
  width: 480px;
  text-align: center;
}
#mg-sp .modal_search_amazon .modal-container .modal-contents .window_title {
  font-size: 24px;
}
#mg-sp .modal_search_amazon .modal-container .modal-contents .item_list input {
  font-size: inherit;
}
#mg-sp .modal_search_amazon .modal-container .modal-contents .item_list_area {
  top: 144px;
}
#mg-sp .modal_search_amazon .modal-container .modal-contents .amazon_item_name {
  line-height: 20px;
  font-size: 18px;
}.pwa_window {
  width: 600px;
  background-color: #F0F0F0;
  padding: 10px 20px 20px 20px;
  border: 1px solid #EDEDED;
  box-sizing: border-box;
  z-index: 999;
  float: right;
  position: fixed;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.pwa_window .close_window {
  border-radius: 3px;
  box-sizing: border-box;
  border: 1px solid #FFF;
  padding-bottom: 10px;
  position: absolute;
  top: 12px;
  right: 28px;
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  width: 30px;
  height: 30px;
  overflow: hidden;
  color: #FFF;
  text-align: center;
  line-height: 28px;
}
.pwa_window .logo {
  margin: 30px 0 20px 0;
}
.pwa_window .question {
  font-size: 30px;
  line-height: 32px;
  color: #000;
  text-align: center;
  margin-top: 20px;
}
.pwa_window .description {
  font-size: 24px;
  line-height: 32px;
  color: #000;
  text-align: center;
  padding-top: 30px;
}
.pwa_window .btn_close {
  position: absolute;
  right: 15px;
  top: 12px;
  padding: 3px;
  cursor: pointer;
}
.pwa_window .btn_area {
  padding-left: 20px;
  padding-right: 20px;
  margin: 30px 0;
}
.pwa_window .btn_submit {
  width: 100%;
  padding: auto 15px;
  font-size: 20px;
  line-height: 50px;
  height: 50px;
  /*margin-bottom: 30px;*/
  background-color: #32CBFD;
  color: #FFF;
}
#mg-sp .pwa_window .close_window {
  border: 1px solid #000;
  font-size: 48px;
  width: 48px;
  height: 48px;
  color: #000;
  line-height: 38px;
}
#mg-sp .pwa_window .btn_submit {
  border-radius: 6px;
  height: 80px;
  width: 100%;
  text-align: center;
  vertical-align: middle;
  /*background-color: #32CBFD;*/
  /*color: #FFF;*/
  font-size: 34px;
  line-height: 80px;
  box-sizing: border-box;
  cursor: pointer;
}.module {
  border-radius: 6px;
  margin-bottom: 20px;
  background-color: #FFF;
  overflow: auto;
  color: #333;
}
.module .module_tab {
  float: left;
  width: 100%;
  background-color: #f0f0f0;
}
.module .module_tab ul li {
  float: left;
  width: 33.33%;
  height: 30px;
  line-height: 30px;
  text-align: center;
  background-color: #f0f0f0;
  cursor: pointer;
}
.module .module_tab ul li:hover {
  background-color: #e9e9e9;
}
.module .module_tab ul li.active {
  background-color: #fff;
}
.module .title_area {
  box-sizing: border-box;
  width: 100%;
  padding: 10px;
  display: inline-block;
}
.module .title_area .title {
  font-size: 16px;
  font-weight: bold;
}
.module .title_area .title img {
  float: left;
  display: inline-block;
  margin-right: 9px;
}
.module .title_area .count {
  font-size: 12px;
  color: #999;
  font-weight: normal;
}
.module .list_area {
  display: flex;
  flex-wrap: wrap;
  padding: 0 10px;
  justify-content: space-between;
  align-content: space-between;
}
.module .list_area .user_thumbs_s {
  padding: 0 1px 10px 0;
}
.module .list_area .user_thumbs_s img {
  width: 45px;
  height: 45px;
}
.module .list_area .user_thumbs_s.empty {
  padding: 0 1px 0 0;
  width: 45px;
  height: 0;
}
.module .list_area .user_thumbs_m {
  padding-bottom: 10px;
}
.module .list_area .user_thumbs_m img {
  width: 75px;
  height: 75px;
}
.module .list_area .user_thumbs_m.empty {
  padding-bottom: 0;
  width: 75px;
  height: 0;
}
.module .list_area .item_thumbs_s {
  padding-bottom: 10px;
  position: relative;
}
.module .list_area .item_thumbs_s img {
  width: 100px;
  height: 100px;
}
.module .list_area .item_thumbs_s.empty {
  padding-bottom: 0;
  width: 100px;
  height: 0;
}
.module .list_area .item_thumbs_s .icon_lock {
  position: absolute;
  top: 3px;
  left: 3px;
  color: #ffb500;
  font-size: 16px;
}
.module .show_more {
  background-color: #f6f6f6;
  text-align: center;
  border-top: 1px solid #dedede;
  clear: both;
  padding: 10px 0;
}
.module .show_more a {
  display: inline-block;
  width: 100%;
  height: 100%;
  color: #999;
}
.module .show_more a:hover {
  opacity: 0.8;
  text-decoration: none;
}
.module .loading {
  padding-bottom: 10px;
  text-align: center;
}
.module .loading img {
  width: 48px;
  height: 48px;
}
.module .none_user {
  padding: 0 10px 10px 10px;
}.login_window {
  width: 600px;
  background-color: #F0F0F0;
  padding: 10px 20px 20px 20px;
  border: 1px solid #EDEDED;
  box-sizing: border-box;
  z-index: 999;
  float: right;
  position: fixed;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.login_window .close_window {
  border-radius: 3px;
  box-sizing: border-box;
  border: 1px solid #FFF;
  padding-bottom: 10px;
  position: absolute;
  top: 12px;
  right: 28px;
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  width: 30px;
  height: 30px;
  overflow: hidden;
  color: #FFF;
  text-align: center;
  line-height: 28px;
}
.login_window .window_message {
  text-align: center;
  margin-bottom: 12px;
}
.login_window .window_title {
  font-size: 30px;
  line-height: 32px;
  color: #000;
  text-align: center;
  padding-top: 10px;
  margin-bottom: 20px;
}
.login_window .btn_close {
  position: absolute;
  right: 15px;
  top: 12px;
  padding: 3px;
  cursor: pointer;
}
.login_window .login_area {
  padding-left: 20px;
  padding-right: 20px;
}
.login_window form {
  text-align: center;
}
.login_window input[type=text],
.login_window input[type=email],
.login_window input[type=password] {
  padding-right: 15px;
  padding-left: 15px;
  font-size: 14px;
  height: 50px;
  font-weight: normal;
  color: #000;
  border: solid 1px #ccc;
  margin-bottom: 20px;
  width: 100%;
  box-sizing: border-box;
  border-radius: 3px;
}
.login_window .btn_submit {
  width: 100%;
  padding: auto 15px;
  font-size: 20px;
  line-height: 50px;
  height: 50px;
  margin-bottom: 30px;
}
.login_window .attention {
  text-align: center;
  font-size: 12px;
  line-height: 14px;
  color: #999;
}
.login_window .attention a {
  color: #0099FF;
}
#mg-sp .login_window {
  width: 100%;
  height: 100%;
  position: absolute;
}
#mg-sp .login_window .close_window {
  border: 1px solid #000;
  font-size: 48px;
  width: 48px;
  height: 48px;
  color: #000;
  line-height: 38px;
}
#mg-sp .login_window .attention {
  font-size: inherit;
  line-height: inherit;
}.list_unit {
  position: relative;
  overflow: hidden;
  background-color: #fff;
  box-sizing: border-box;
  border-radius: 6px;
  margin-bottom: 20px;
  padding: 12px;
  width: 640px;
  color: #333;
}
.list_unit .btn_follow {
  position: absolute;
  top: 12px;
  right: 12px;
}
.list_unit .left_area {
  box-sizing: border-box;
  width: 160px;
  text-align: center;
  margin-right: 8px;
}
.list_unit .left_area .unit_icon_area {
  position: relative;
  display: inline-block;
  margin-bottom: 6px;
  width: 160px;
  height: 160px;
}
.list_unit .right_area .unit_name {
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #333;
  font-size: 24px;
  padding: 2px 0;
}
.list_unit .right_area .description_area_wrap {
  overflow: hidden;
}
.list_unit .right_area .description_area_wrap .description_area {
  position: relative;
  overflow: hidden;
  margin-top: 4px;
}
.list_unit .right_area .description_area_wrap .description_area.hidden::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  z-index: 50;
  width: 100%;
  height: 60%;
  background: linear-gradient(to top, transparent, #fff 0%, #fff 0%, transparent);
}
.list_unit .unit_users_area {
  margin-top: 10px;
  font-size: 0;
}
.list_unit .unit_users_area .entry_count {
  margin-right: 4px;
  color: #333;
}
.list_unit .unit_users_area .entry_count em {
  font-size: 18px;
  font-style: normal;
}
.list_unit .unit_users_area .unit_user {
  display: inline-block;
  margin-right: 6px;
}
.list_unit .unit_users_area .unit_user img {
  width: 32px;
  height: 32px;
}
.list_unit .unit_users_area a {
  font-size: 12px;
}
.list_unit .show_link {
  display: block;
  background-color: #f6f6f6;
  border-top: 1px solid #dedede;
  margin: 10px -12px -12px -12px;
  height: 40px;
  line-height: 40px;
  color: #999;
  text-align: center;
  font-size: 16px;
}
.list_unit .show_link:hover {
  text-decoration: none;
}
#mg-sp .list_unit {
  margin: 0 8px 28px 8px;
  width: 624px;
}
#mg-sp .list_unit .left_area {
  margin-right: 12px;
}
#mg-sp .list_unit .left_area .unit_icon_area {
  margin-bottom: 8px;
}
#mg-sp .list_unit .right_area .description_area_wrap .description_area {
  margin-top: 12px;
}
#mg-sp .list_unit .right_area .unit_name {
  margin-top: 8px;
  max-width: 268px;
  font-size: 30px;
}
#mg-sp .list_unit .unit_users_area .entry_count {
  font-size: 16px;
}
#mg-sp .list_unit .unit_users_area .entry_count em {
  font-size: 26px;
}
#mg-sp .list_unit .unit_users_area .unit_user:not(:last-of-type) {
  margin-right: 5px;
}
#mg-sp .list_unit .unit_users_area .unit_user img {
  width: 40px;
  height: 40px;
}
#mg-sp .list_unit .unit_users_area a {
  font-size: 20px;
}
#mg-sp .list_unit .show_link {
  height: 56px;
  line-height: 56px;
  font-size: 22px;
}.v--modal-overlay {
  overflow: scroll;
}
.competition_judge_invite_modal {
  width: 480px;
  height: 640px;
  color: #333;
}
.competition_judge_invite_modal .competition_judge_invite_modal_header {
  box-sizing: border-box;
  border-bottom: 1px solid #ededed;
  padding: 12px 0;
  text-align: center;
  font-size: 16px;
}
.competition_judge_invite_modal .content {
  float: none;
  width: 100%;
  height: 400px;
  margin-bottom: 0;
}
.competition_judge_invite_modal .content .loading {
  text-align: center;
  padding-top: 20px;
}
.competition_judge_invite_modal .content .empty {
  background-color: inherit;
  padding: 12px;
}
.competition_judge_invite_modal .content .list {
  height: 400px;
  overflow-y: scroll;
}
.competition_judge_invite_modal .content .list table tr.can_invite:hover {
  background-color: #c6f0ff;
  cursor: pointer;
}
.competition_judge_invite_modal .content .list table tr td {
  padding: 8px 0;
}
.competition_judge_invite_modal .content .list table tr td.checkbox_area {
  padding-top: 12px;
  width: 40px;
  text-align: center;
  vertical-align: middle;
}
.competition_judge_invite_modal .content .list table tr td.checkbox_area input {
  margin-bottom: 0;
  width: 12px;
}
.competition_judge_invite_modal .content .list table tr td.img_area {
  width: 52px;
}
.competition_judge_invite_modal .content .list table tr td.img_area img {
  width: 40px;
  height: 40px;
}
.competition_judge_invite_modal .content .list table tr td.invite_status_area {
  padding-right: 16px;
  text-align: right;
  font-weight: bold;
  color: #ff0000;
}
.competition_judge_invite_modal .footer {
  border-top: 1px solid #ededed;
  padding: 16px;
  text-align: center;
}
.competition_judge_invite_modal .footer textarea {
  padding: 8px;
  margin-bottom: 10px;
  height: 80px;
}
.competition_judge_invite_modal .footer .invite_button {
  background-color: #fff;
  border-radius: 6px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  width: 100px;
  height: 32px;
  line-height: 32px;
  font-size: 12px;
  color: #666;
  cursor: pointer;
}
.competition_judge_invite_modal .footer .invite_button[disabled] {
  background-color: #ccc;
  cursor: not-allowed;
}
.swal_invite_judge_confirm h2.swal2-title {
  font-size: 20px;
  font-weight: normal;
}
#mg-sp .competition_judge_invite_modal .competition_judge_invite_modal_header {
  padding: 16px 0;
  font-size: 20px;
}
#mg-sp .competition_judge_invite_modal .content {
  height: 380px;
}
#mg-sp .competition_judge_invite_modal .content .list table tr td {
  padding: 12px 0 !important;
}
#mg-sp .competition_judge_invite_modal .content .list table tr td.checkbox_area input {
  transform: scale(1.6);
  margin-bottom: 0;
  width: 13px;
}
#mg-sp .competition_judge_invite_modal .content .list table tr td.img_area {
  width: 56px;
}
#mg-sp .competition_judge_invite_modal .content .list table tr td.img_area img {
  width: 48px;
  height: 48px;
}
#mg-sp .competition_judge_invite_modal .content .list table tr td.name_area {
  font-size: 18px;
}
#mg-sp .competition_judge_invite_modal .content .list table tr td.invite_status_area {
  padding-right: 20px !important;
  font-size: 16px;
}
#mg-sp .competition_judge_invite_modal .footer textarea {
  border: solid 1px #ccc !important;
  padding: 8px 10px !important;
  margin-bottom: 4px !important;
  height: 80px;
  font-size: 18px !important;
}
#mg-sp .competition_judge_invite_modal .footer .invite_button {
  width: 120px;
  height: 40px;
  line-height: 40px;
  font-size: 16px;
}#pg_messages .comment_display_area dl:hover {
  background-color: #E8F6FF;
  cursor: pointer;
}
.message_area {
  background-color: #FFF;
  min-height: 800px;
  border-radius: 6px;
  padding-bottom: 200px;
}
.message_area .pankuzu {
  border-radius: 6px 6px 0 0;
  background-color: #f6f7f9;
  font-size: 16px;
  line-height: 18px;
  padding: 15px 10px;
  color: #666;
  border-bottom: 1px solid #DEDEDE;
}
.message_area .pankuzu a {
  color: #666;
}
.message_area .no_data_message {
  padding: 20px;
}
.message_area .comment_display_area {
  background-color: #FFF;
  border-radius: 6px 6px 0 0;
}
.message_area .comment_display_area > div {
  padding: 5px;
}
.message_area .comment_display_area .read {
  background-color: #FFF;
}
.message_area .comment_display_area .unread {
  background-color: #E8F6FF;
}
.message_area .comment_display_area dl {
  padding: 10px;
  display: table;
  border-bottom: 1px solid #E2E2E2;
}
.message_area .comment_display_area dl dt {
  display: table-cell;
  padding: 5px;
}
.message_area .comment_display_area dl dt.message_header img {
  width: 60px;
  height: 60px;
  border-radius: 6px;
}
.message_area .comment_display_area dl dt.message_avater img {
  width: 40px;
  height: 40px;
  border-radius: 6px;
}
.message_area .comment_display_area dl dd {
  display: table-cell;
  vertical-align: top;
  padding: 5px;
  width: 100%;
}
.message_area .comment_display_area dl dd .user_name {
  color: #3F73B6;
  font-size: 14px;
  line-height: 16px;
  font-weight: bold;
  display: block;
  margin-bottom: 5px;
}
.message_area .comment_display_area dl dd .comment_text {
  font-size: 12px;
  line-height: 16px;
  color: #000;
  margin-bottom: 5px;
  white-space: pre-wrap;
  display: block;
}
.message_area .comment_display_area dl dd .comment_text_overview {
  font-size: 12px;
  line-height: 16px;
  color: #999;
  margin-bottom: 5px;
  display: block;
}
.message_area .comment_display_area dl dd .date {
  font-size: 12px;
  line-height: 16px;
  color: #AAA;
  text-align: right;
  display: block;
}
.message_area .comment_display_area dl dd .action_area {
  padding: 3px;
}
.message_area .comment_display_area dl dd .action_area a.btn_login,
.message_area .comment_display_area dl dd .action_area .btn_like,
.message_area .comment_display_area dl dd .action_area .btn_reply {
  color: #3F73B6;
  cursor: pointer;
}
.message_area .comment_display_area dl dd .reply_area .btn_reply_message,
.message_area .comment_display_area dl dd .reply_area .btn_reply_cnt {
  color: #3F73B6;
  cursor: pointer;
}
#mg-sp .message_area {
  min-height: 1000px;
}
#mg-sp .message_area .pankuzu {
  /*background-color: #f6f7f9;*/
  background-color: #333;
  font-size: 30px;
  line-height: 32px;
  padding: 25px 20px;
  color: #FFF;
  border-bottom: 1px solid #CCC;
}
#mg-sp .message_area .pankuzu a {
  color: #FFF;
}
#mg-sp .message_area .no_data_message {
  padding: 32px 20px;
}
#mg-sp .message_area .comment_display_area dl {
  border-bottom: 2px solid #DEDEDE;
}
#mg-sp .message_area .comment_display_area dl dt.message_header img {
  width: 90px;
  height: 90px;
}
#mg-sp .message_area .comment_display_area dl dt.message_avater img {
  width: 70px;
  height: 70px;
  border-radius: 3px;
}
#mg-sp .message_area .comment_display_area dl dd .user_name {
  font-size: 24px;
  line-height: 26px;
}
#mg-sp .message_area .comment_display_area dl dd .comment_text {
  font-size: 24px;
  line-height: 26px;
}
#mg-sp .message_area .comment_display_area dl dd .comment_text_overview {
  font-size: 24px;
  line-height: 26px;
}
#mg-sp .message_area .comment_display_area dl dd .date {
  font-size: 20px;
  line-height: 26px;
}div.dropzone h3 span {
  font-size: 12px;
}
div.dropzone .dropzone_img_unit {
  box-sizing: border-box;
  padding: 20px;
  background-color: #D1E5F2;
  margin-bottom: 20px;
  position: relative;
}
div.dropzone .dropzone_img_unit .btn_img_controll {
  text-align: right;
  position: relative;
  top: -8px;
}
div.dropzone .dropzone_img_unit .btn_img_controll span {
  display: inline-block;
  border-radius: 50%;
  margin-left: 5px;
  padding: 0;
  width: 25px;
  height: 25px;
  cursor: pointer;
}
div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_down {
  background: url("/img/icon_form_down.png") no-repeat center/100%;
}
div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_down:hover {
  background: url("/img/icon_form_down_on.png") no-repeat center/100%;
}
div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_up {
  background: url("/img/icon_form_up.png") no-repeat center/100%;
}
div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_up:hover {
  background: url("/img/icon_form_up_on.png") no-repeat center/100%;
}
div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_rotate {
  background: url("/img/icon_form_rotate.png") no-repeat center/100%;
}
div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_rotate:hover {
  background: url("/img/icon_form_rotate_on.png") no-repeat center/100%;
}
div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_delete {
  background: url("/img/icon_form_delete.png") no-repeat center/100%;
}
div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_delete:hover {
  background: url("/img/icon_form_delete_on.png") no-repeat center/100%;
}
div.dropzone .dropzone-area {
  cursor: pointer;
  position: relative;
  box-sizing: border-box;
  border: 2px dashed #CBFFFF;
}
div.dropzone .dropzone-area:hover {
  border: 2px dashed #2E94C4;
}
div.dropzone .dropzone-area:hover .dropzone-title {
  color: #1975A0;
}
div.dropzone .dropzone-area .dropzone-text {
  position: absolute;
  top: 50%;
  text-align: center;
  transform: translate(0, -50%);
  width: 100%;
}
div.dropzone .dropzone-area .dropzone-text span {
  display: block;
  line-height: 1.9;
}
div.dropzone .dropzone-area .dropzone-text .dropzone-title {
  font-size: 14px;
  color: #666;
}
div.dropzone .dropzone-area .dropzone-text .dropzone-info,
div.dropzone .dropzone-area .dropzone-text .dropzone-imagesize {
  font-size: 13px;
  color: #999;
}
div.dropzone .dropzone-preview {
  position: relative;
}
div.dropzone .dropzone-preview .btn_form_delete {
  position: absolute;
  top: 10px;
  right: 10px;
  display: none;
  cursor: pointer;
  z-index: 99;
}
div.dropzone .dropzone-preview:hover .btn_form_delete {
  display: block;
}
div.dropzone .dropzone-preview img {
  display: block;
  height: auto;
}
div.dropzone .dropzone-preview input[type=file] {
  position: absolute;
  cursor: pointer;
  top: 0px;
  right: 0;
  bottom: 0;
  left: 0;
  width: 0;
  height: 0;
  opacity: 0;
}
div.dropzone .click-dropzone {
  width: 100%;
  height: 100%;
}
#mg-sp div.dropzone .dropzone_img_unit .btn_img_controll span {
  margin-left: 10px;
  width: 50px;
  height: 50px;
}
#mg-sp div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_down {
  background: url("/img/icon_form_down_on.png") no-repeat center/100%;
}
#mg-sp div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_up {
  background: url("/img/icon_form_up_on.png") no-repeat center/100%;
}
#mg-sp div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_rotate {
  background: url("/img/icon_form_rotate_on.png") no-repeat center/100%;
}
#mg-sp div.dropzone .dropzone_img_unit .btn_img_controll .btn_form_delete {
  background: url("/img/icon_form_delete_on.png") no-repeat center/100%;
}
#mg-sp div.dropzone .dropzone-area {
  border-width: 4px;
}
#mg-sp div.dropzone .dropzone-area:hover {
  border-width: 4px;
}
#mg-sp div.dropzone .dropzone-area .dropzone-text .dropzone-title {
  font-size: 26px;
}
#mg-sp div.dropzone .dropzone-area .dropzone-text .dropzone-info,
#mg-sp div.dropzone .dropzone-area .dropzone-text .dropzone-imagesize {
  font-size: 22px;
}
#mg-sp div.dropzone .dropzone-preview input[type=file] {
  width: 100%;
  height: 100%;
}.modal_user_list {
  width: auto !important;
  padding: 0 !important;
}
.modal_user_list .modal-container {
  width: 480px;
  padding: 0;
}
.modal_user_list .modal-container .modal-contents {
  float: right;
  width: 480px;
  display: block;
  z-index: 9999;
  border-radius: 6px;
  background-color: #FFF;
  padding: 10px 0 0 0;
  border: 1px solid #EDEDED;
  box-sizing: border-box;
}
.modal_user_list .modal-container .modal-contents .window_title {
  font-size: 16px;
  margin-bottom: 8px;
  padding-bottom: 8px;
  color: #000;
  text-align: center;
  border-bottom: 1px solid #EDEDED;
  box-sizing: border-box;
}
.modal_user_list .modal-container .modal-contents .user_list {
  padding-left: 10px;
  padding-right: 10px;
  overflow-y: auto;
}
.modal_user_list .modal-container .modal-contents .user_list .item_list_area {
  position: absolute;
  top: 104px;
  bottom: 0;
  left: 0;
  right: 0;
  overflow-y: auto;
}
.modal_user_list .modal-container .modal-contents .user_list table tr {
  border-bottom: 1px solid #EDEDED;
}
.modal_user_list .modal-container .modal-contents .user_list table tr:last-child {
  border: none;
}
.modal_user_list .modal-container .modal-contents .user_list table tr:hover {
  background-color: #c6f0ff;
  cursor: pointer;
}
.modal_user_list .modal-container .modal-contents .user_list table td {
  padding-top: 10px;
  padding-bottom: 10px;
}
.modal_user_list .modal-container .modal-contents .user_list table td input[type=checkbox] {
  margin: 0 10px;
}
.modal_user_list .modal-container .modal-contents .user_list table td.Avatar {
  width: 30px;
  height: 30px;
  overflow: hidden;
}
.modal_user_list .modal-container .modal-contents .user_list table td.ItemImage {
  text-align: center;
  width: 48px;
  height: 48px;
}
.modal_user_list .modal-container .modal-contents .user_list table td.ItemImage img {
  margin: 0 10px;
  width: auto;
  height: 100%;
}
.modal_user_list .modal-container .modal-contents .user_list table td.UserName {
  padding-left: 6px;
}
.modal_user_list .modal-container .modal-contents .user_list table td.UserName span {
  color: #999;
}
.modal_user_list .modal-container .modal-contents .window_bottom {
  clear: both;
  border-top: 1px solid #EDEDED;
  padding: 16px;
  box-sizing: border-box;
  position: absolute;
  bottom: 0;
  width: 480px;
  text-align: center;
}
.modal_user_list .modal-container .modal-contents .window_bottom textarea {
  font-size: 14px;
  line-height: 16px;
  font-weight: normal;
  color: #000;
  border: solid 1px #ccc;
  width: 100%;
  box-sizing: border-box;
  border-radius: 3px;
  text-align: left;
  padding: 8px;
  margin-bottom: 10px;
  height: 80px;
}
.modal_user_list .modal-container .modal-contents .window_bottom button.btn-invite {
  border: 1px solid #ccc;
  box-sizing: border-box;
  width: 100px;
  background-color: white;
  z-index: 9999;
  font-size: 12px;
  color: #666;
  line-height: 20px;
  cursor: pointer;
  border-radius: 6px;
}
#mg-sp .modal_user_list .modal-container .modal-contents .window_title {
  font-size: 24px;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 2px solid #EDEDED;
}
#mg-sp .modal_user_list .modal-container .modal-contents .user_list {
  padding: 0;
}
#mg-sp .modal_user_list .modal-container .modal-contents .user_list table tr td {
  padding-top: 10px;
  padding-bottom: 10px;
}
#mg-sp .modal_user_list .modal-container .modal-contents .user_list table tr td input[type=checkbox] {
  margin: 0 16px;
  transform: scale(1.8);
}
#mg-sp .modal_user_list .modal-container .modal-contents .user_list table tr td.Avatar {
  width: 64px;
}
#mg-sp .modal_user_list .modal-container .modal-contents .user_list table tr td.Avatar img {
  width: 48px;
  height: 48px;
}
#mg-sp .modal_user_list .modal-container .modal-contents .window_bottom {
  border-top: 2px solid #ededed;
  padding: 16px 0;
  width: 500px;
}
#mg-sp .modal_user_list .modal-container .modal-contents .window_bottom textarea {
  font-size: 18px;
}
#mg-sp .modal_user_list .modal-container .modal-contents .window_bottom button.btn-invite {
  width: 160px;
  line-height: 48px;
  font-size: 20px;
}.top_gallery .item {
  margin-right: 20px;
}
.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.icon_lock {
  color: #ffb500;
  padding: 0 5px;
  text-shadow: none;
  -webkit-text-stroke: 1px #FFF;
}
.gallery,
.top_gallery {
  clear: both;
}
.gallery .item,
.top_gallery .item {
  margin-bottom: 20px;
  width: 200px;
  height: 200px;
  float: left;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.gallery .item.empty,
.top_gallery .item.empty {
  width: 200px;
  height: 0;
  margin-bottom: 0;
}
.gallery .item a,
.top_gallery .item a {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 200px;
  height: 200px;
}
.gallery .item a h2,
.top_gallery .item a h2 {
  position: absolute;
  left: 0px;
  bottom: 0px;
  background-color: rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  padding: 4px 6px;
  width: 200px;
  line-height: 18px;
  text-align: center;
  color: #fff;
  font-size: 16px;
  text-shadow: 1px 1px 3px #000;
  font-weight: normal;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.gallery .item .label_area,
.top_gallery .item .label_area {
  position: absolute;
  top: 0;
  right: 0;
  box-sizing: border-box;
  width: 100%;
  padding: 6px;
  font-size: 0;
  text-align: right;
}
.gallery .item a p.label,
.top_gallery .item a p.label {
  display: inline-block;
  border-radius: 10px;
  height: 18px;
  line-height: 18px;
  margin: 0 0 4px 0;
  padding: 0px 10px;
  font-size: 12px;
  color: #fff;
}
.gallery .item a p.label.complete,
.top_gallery .item a p.label.complete {
  background-color: #3399ff;
}
.gallery .item a p.label.now_at_work,
.top_gallery .item a p.label.now_at_work {
  background-color: #f9ff00;
  color: #333;
}
.gallery .item a p.label.competition,
.top_gallery .item a p.label.competition {
  background-color: #ff9900;
}
.gallery .item a p.label.competition_no1,
.top_gallery .item a p.label.competition_no1 {
  background-color: #ff3300;
}
.gallery .item a p.label.competition_no2, .gallery .item a p.label.competition_no3, .gallery .item a p.label.award_title,
.top_gallery .item a p.label.competition_no2,
.top_gallery .item a p.label.competition_no3,
.top_gallery .item a p.label.award_title {
  background-color: #ff9900;
}
.gallery .item .delete_item,
.top_gallery .item .delete_item {
  position: absolute;
  top: 6px;
  left: 6px;
  height: 20px;
  line-height: 20px;
  padding: 3px;
  font-size: 20px;
  color: #fff;
  text-shadow: 1px 1px 1px #aaa;
  cursor: pointer;
}
#mg-sp .gallery_bottom {
  padding-bottom: 10px;
}
#mg-sp .gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#mg-sp .gallery,
#mg-sp .top_gallery {
  width: 100%;
  height: 100%;
  background-color: #FFF;
}
#mg-sp .gallery.bg-none,
#mg-sp .top_gallery.bg-none {
  background-color: inherit !important;
}
#mg-sp .gallery .item,
#mg-sp .top_gallery .item {
  margin: 0;
  box-sizing: border-box;
  width: 320px;
  height: 320px;
}
#mg-sp .gallery .item.empty,
#mg-sp .top_gallery .item.empty {
  width: 320px;
  height: 0;
}
#mg-sp .gallery .item a,
#mg-sp .top_gallery .item a {
  width: 314px;
  height: 314px;
}
#mg-sp .gallery .item a img,
#mg-sp .top_gallery .item a img {
  margin: 0 auto;
  width: 314px;
  height: 314px;
}
#mg-sp .gallery .item a h2,
#mg-sp .top_gallery .item a h2 {
  padding: 6px;
  width: 314px;
  line-height: 25px;
  font-size: 22px;
}
#mg-sp .gallery .item .label_area,
#mg-sp .top_gallery .item .label_area {
  padding: 10px;
}
#mg-sp .gallery .item a p.label,
#mg-sp .top_gallery .item a p.label {
  border-radius: 16px;
  height: 32px;
  line-height: 32px;
  margin: 0 0 6px 0;
  padding: 0 16px;
  font-size: 18px;
}
#mg-sp .gallery .item .delete_item,
#mg-sp .top_gallery .item .delete_item {
  top: 10px;
  left: 10px;
  height: 30px;
  line-height: 30px;
  padding: 5px;
  font-size: 30px;
}.config_button_area {
  position: relative;
  width: 30px;
}
.config_button_area img {
  cursor: pointer;
}
.config_button_area .config_sub_menu {
  display: none;
  position: absolute;
  top: 36px;
  left: -125px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
  background-color: #fcfcfc;
  border-radius: 4px;
  width: 165px;
  z-index: 1000;
}
.config_button_area .config_sub_menu:before {
  content: "";
  position: absolute;
  top: -12px;
  right: 12px;
  border-width: 0 12px 12px 12px;
  border-style: solid;
  border-color: transparent transparent rgba(0, 0, 0, 0.25) transparent;
  border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0.06) rgba(0, 0, 0, 0);
  height: auto;
  width: auto;
}
.config_button_area .config_sub_menu:after {
  content: "";
  position: absolute;
  top: -12px;
  right: 12px;
  border-width: 0 12px 12px 12px;
  border-style: solid;
  border-color: transparent transparent rgba(0, 0, 0, 0.25) transparent;
  border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0.06) rgba(0, 0, 0, 0);
  height: auto;
  width: auto;
  top: -10px;
  right: 14px;
  border-width: 0 10px 10px 10px;
  border-color: transparent transparent #fcfcfc transparent;
  border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #fcfcfc rgba(0, 0, 0, 0);
}
.config_button_area .config_sub_menu ul li {
  display: block;
  box-sizing: border-box;
  height: 38px;
  line-height: 38px;
  text-align: left;
  padding-left: 8px;
}
.config_button_area .config_sub_menu ul li.disabled {
  color: #999;
}
.config_button_area .config_sub_menu ul li:not(.disabled):hover {
  cursor: pointer;
  background-color: #f6f6f6;
}
.config_button_area .config_sub_menu ul li:not(:last-of-type) {
  border-bottom: 1px solid #ddd;
}
.config_button_area .config_sub_menu ul li:first-of-type {
  border-radius: 4px 4px 0 0;
}
.config_button_area .config_sub_menu ul li:last-of-type {
  border-radius: 0 0 4px 4px;
}
.config_button_area .config_sub_menu ul li a {
  display: inline-block;
  width: 100%;
  height: 100%;
  color: #333;
}
.config_button_area .config_sub_menu ul li a:hover {
  text-decoration: none;
}
.config_button_area .config_sub_menu ul li .fa {
  margin-right: 6px;
}
.config_button_area .config_sub_menu ul.auth_menu li:first-of-type {
  border-top: 1px solid #ddd;
}
#mg-sp .config_button_area img {
  width: 52px;
  height: 52px;
}
#mg-sp .config_button_area .config_sub_menu {
  top: 66px;
  left: -252px;
  box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.25);
  border-radius: 8px;
  width: 298px;
}
#mg-sp .config_button_area .config_sub_menu:before {
  top: -22px;
  right: 8px;
  border-width: 0 22px 22px 22px;
}
#mg-sp .config_button_area .config_sub_menu:after {
  top: -22px;
  right: 8px;
  border-width: 0 22px 22px 22px;
  top: -16px;
  right: 14px;
  border-width: 0 16px 16px 16px;
}
#mg-sp .config_button_area .config_sub_menu ul li {
  height: 72px;
  line-height: 72px;
  padding-left: 14px;
  font-size: 20px;
}.user_menu_window {
  width: 400px;
  height: 100%;
  background-color: #FFF;
  padding: 0;
  box-sizing: border-box;
  z-index: 999;
  float: right;
  position: fixed;
  top: 0;
  right: 0;
}
.user_menu_window .close_window {
  border-radius: 3px;
  box-sizing: border-box;
  border: 1px solid #FFF;
  padding-bottom: 10px;
  position: absolute;
  top: 12px;
  right: 28px;
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  width: 30px;
  height: 30px;
  overflow: hidden;
  color: #FFF;
  text-align: center;
  line-height: 28px;
}
.user_menu_window .window_message {
  text-align: center;
  margin-bottom: 12px;
}
.user_menu_window .window_title {
  font-size: 30px;
  line-height: 32px;
  color: #000;
  text-align: center;
  padding-top: 10px;
  margin-bottom: 20px;
}
.user_menu_window .btn_close {
  position: absolute;
  right: 15px;
  top: 12px;
  padding: 3px;
  cursor: pointer;
}
.user_menu_window .user_menu_window_list {
  overflow-y: auto;
  height: 100vh;
}
.user_menu_window .user_menu_window_list table tr td {
  position: relative;
  vertical-align: top;
  width: 33%;
  overflow: visible;
}
.user_menu_window .user_menu_window_list table tr td a {
  font-size: 12px;
  line-height: 14px;
  display: block;
  margin: 5px;
  text-align: center;
}
.user_menu_window .user_menu_window_list table tr td img {
  width: 60px;
  height: 60px;
  border-radius: 10px;
  box-sizing: border-box;
}
.user_menu_window .user_menu_window_list .menu_list_title {
  font-size: 18px;
  line-height: 20px;
  color: #000;
  margin-bottom: 5px;
}
.user_menu_window .user_menu_window_list .list_1st {
  background: linear-gradient(#555555, #000000);
  padding: 20px 30px 10px 30px;
  text-align: center;
}
.user_menu_window .user_menu_window_list .list_1st td a {
  color: #FFF;
}
.user_menu_window .user_menu_window_list .list_2nd,
.user_menu_window .user_menu_window_list .list_3rd {
  background-color: #FFF;
  padding: 15px 30px 10px 30px;
  text-align: center;
  border-bottom: 1px solid #DEDEDE;
}
.user_menu_window .user_menu_window_list .list_2nd a,
.user_menu_window .user_menu_window_list .list_3rd a {
  color: #333;
}
.user_menu_window .user_menu_window_list .list_lang {
  background-color: #FFF;
  padding: 10px;
  text-align: center;
  font-size: 12px;
  line-height: 16px;
  color: #CCC;
}
.user_menu_window .user_menu_window_list .list_lang span {
  font-size: 14px;
  line-height: 16px;
  color: #000;
}
.user_menu_window .user_menu_window_list .list_lang a {
  color: #333;
}
.user_menu_window .user_menu_window_list .list_footer {
  background-color: #EDEDED;
  padding: 10px;
  text-align: center;
  font-size: 12px;
  line-height: 14px;
  color: #CCC;
}
.user_menu_window .user_menu_window_list .list_footer .upper_row {
  margin: 0 0 8px 0;
}
.user_menu_window .user_menu_window_list .list_footer .lower_row {
  margin: 8px 0 0 0;
}
.user_menu_window .user_menu_window_list .list_footer a {
  color: #333;
}
.user_menu_window .user_menu_window_list .menu_copyright {
  text-align: center;
  padding-top: 10px;
  font-size: 12px;
  line-height: 14px;
  color: #666;
}
.user_menu_window .avatar {
  margin-bottom: 5px;
  text-align: center;
}
.user_menu_window .avatar a {
  font-size: 20px;
  line-height: 22px;
  color: #FFF;
  display: block;
  margin: 10px;
}
.user_menu_window .avatar img {
  border-radius: 50%;
  box-sizing: border-box;
  width: 70px;
  height: 70px;
}
.user_menu_window .attention {
  text-align: center;
  font-size: 12px;
  line-height: 14px;
  color: #999;
}
.user_menu_window .attention a {
  color: #0099FF;
}
.user_menu_window .notification_dot {
  top: 0px;
  right: 18px;
  border-radius: 6px;
  width: 12px;
  height: 12px;
}
#mg-sp .close_window {
  right: 16px;
}
#mg-sp .user_menu_window .notification_dot {
  position: absolute;
  display: block;
  background-color: #ff0000;
  top: 2px;
  right: 22px;
}.violation_button_area {
  position: relative;
}
.violation_button_area .btn_violation {
  width: 70px;
  height: 16px;
  background-color: #FFF;
  color: #F00;
  font-size: 10px;
  display: block;
  position: relative;
  float: left;
  box-sizing: border-box;
  border-radius: 6px;
  line-height: 44px;
  margin: 0 0 0 12px;
  padding-left: 20px;
  text-align: center;
  cursor: pointer;
  line-height: 14px;
  margin: 0px;
  padding-left: 12px;
  border-radius: 3px;
  float: right;
}
.violation_button_area .btn_violation:visited, .violation_button_area .btn_violation:hover {
  color: #fff;
  text-decoration: none;
}
.violation_button_area .btn_violation::before {
  position: absolute;
  top: auto;
  bottom: auto;
  left: 12%;
  font-family: FontAwesome;
  font-size: 22px;
}
.violation_button_area .btn_violation:hover::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  background-color: #fff;
  opacity: 0.2;
  z-index: 999;
}
.violation_button_area .btn_violation::before {
  content: "\F05E";
  font-size: 10px;
}
.violation_button_area .btn_violation:hover {
  color: #F00;
}
.violation_button_area .violation_menu {
  display: none;
  position: absolute;
  top: -90px;
  right: 0;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
  background-color: #fcfcfc;
  border-radius: 4px;
  width: 165px;
  z-index: 1000;
}
.violation_button_area .violation_menu:before {
  content: "";
  position: absolute;
  bottom: -12px;
  right: 12px;
  border-width: 12px 12px 0 12px;
  border-style: solid;
  border-color: rgba(0, 0, 0, 0.06) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
  height: auto;
  width: auto;
}
.violation_button_area .violation_menu:after {
  content: "";
  position: absolute;
  border-style: solid;
  height: auto;
  width: auto;
  bottom: -10px;
  right: 14px;
  border-width: 10px 10px 0 10px;
  border-color: #fcfcfc rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
}
.violation_button_area .violation_menu ul li {
  display: block;
  box-sizing: border-box;
  height: 38px;
  line-height: 38px;
  text-align: left;
  padding-left: 8px;
  font-size: 12px;
}
.violation_button_area .violation_menu ul li.disabled {
  color: #999;
}
.violation_button_area .violation_menu ul li:not(.disabled):hover {
  cursor: pointer;
  background-color: #f6f6f6;
}
.violation_button_area .violation_menu ul li:not(:last-of-type) {
  border-bottom: 1px solid #ddd;
}
.violation_button_area .violation_menu ul li:first-of-type {
  border-radius: 4px 4px 0 0;
}
.violation_button_area .violation_menu ul li:last-of-type {
  border-radius: 0 0 4px 4px;
}
.violation_button_area .violation_menu ul li a {
  display: inline-block;
  width: 100%;
  height: 100%;
  color: #333;
}
.violation_button_area .violation_menu ul li a:hover {
  text-decoration: none;
}
.violation_button_area .violation_menu ul li .fa {
  margin-right: 6px;
}
#mg-sp .violation_button_area {
  position: relative;
}
#mg-sp .violation_button_area .btn_violation {
  width: 128px;
  height: 48px;
  border-radius: 6px;
  line-height: 48px;
  padding-left: 24px;
  font-size: 24px;
  width: 120px;
  height: 32px;
  line-height: 32px;
  margin: 0px;
  font-size: 18px;
  border-radius: 6px;
}
#mg-sp .violation_button_area .btn_violation::before {
  left: 12%;
  font-size: 24px;
}
#mg-sp .violation_button_area .btn_violation::before {
  content: "\F05E";
  font-size: 18px;
}
#mg-sp .violation_button_area .btn_violation:hover {
  color: #F00;
}
#mg-sp .violation_button_area .violation_menu {
  top: -160px;
  box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.25);
  border-radius: 8px;
  width: 298px;
}
#mg-sp .violation_button_area .violation_menu:before {
  bottom: -22px;
  right: 8px;
  border-width: 22px 22px 0 22px;
}
#mg-sp .violation_button_area .violation_menu:after {
  bottom: -16px;
  right: 14px;
  border-width: 16px 16px 0 16px;
}
#mg-sp .violation_button_area .violation_menu ul li {
  height: 72px;
  line-height: 72px;
  padding-left: 14px;
  font-size: 20px;
}.timeline_card {
  position: relative;
  overflow: hidden;
  background-color: #fff;
  border-radius: 6px;
  box-sizing: border-box;
  margin-bottom: 20px;
  width: 640px;
}
.timeline_card .header {
  position: relative;
  width: 100%;
  table-layout: fixed;
  padding: 12px;
  box-sizing: border-box;
  border-bottom: 1px solid #ededed;
}
.timeline_card .header table td {
  width: auto;
  white-space: nowrap;
}
.timeline_card .header table .icon_area {
  position: relative;
  width: 54px;
}
.timeline_card .header table .icon_area img {
  border-radius: 6px;
  width: 48px;
  height: 48px;
}
.timeline_card .header table .icon_area img.user_icon {
  position: absolute;
  top: 18px;
  left: 26px;
  width: 30px;
  height: 30px;
}
.timeline_card .header table .contribute_info_area {
  max-width: 280px;
  padding-left: 8px;
}
.timeline_card .header table .contribute_info_area .contributor {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
  font-size: 16px;
  padding: 2px 0 0 0;
}
.timeline_card .header table .contribute_info_area .contributor a {
  color: #333;
}
.timeline_card .header table .contribute_info_area .contributor a .name {
  font-size: 12px;
  color: #999;
}
.timeline_card .header table .contribute_info_area .created_at {
  font-size: 12px;
  line-height: 12px;
  padding-top: 5px;
  color: #999;
  clear: both;
}
.timeline_card .header table .status_area {
  text-align: right;
  color: #ff0000;
  font-size: 12px;
  font-weight: bold;
}
.timeline_card .header table .config_area {
  width: 32px;
}
.timeline_card .header table .config_area .config_button_area {
  margin-left: auto;
}
.timeline_card .content_body {
  float: none;
  padding: 16px;
}
.timeline_card .content_body h2 {
  font-size: 20px;
  line-height: 24px;
  margin-bottom: 5px;
}
.timeline_card .content_body h2 a {
  color: #333;
}
.timeline_card .content_body .thumbnail_area {
  margin-bottom: 16px;
}
.timeline_card .content_body .thumbnail_area .main_img {
  position: relative;
  width: 610px;
  height: 300px;
  overflow: hidden;
}
.timeline_card .content_body .thumbnail_area .sub_img {
  position: relative;
  width: 120px;
  height: 120px;
  overflow: hidden;
  margin: 2px 2px 0 0;
  float: left;
}
.timeline_card .content_body .thumbnail_area div:nth-child(5n) .sub_img {
  margin-right: 0px;
}
.timeline_card .content_body .thumbnail_area .main_img img, .timeline_card .content_body .thumbnail_area .sub_img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.timeline_card .content_body .caption {
  white-space: pre-wrap;
  margin-bottom: 16px;
  line-height: 24px;
  font-size: 14px;
}
.timeline_card .content_body .caption a {
  color: #333;
}
.timeline_card .share_area {
  padding: 16px;
}
.timeline_card .btn_vote {
  width: 160px;
  padding-top: 2px;
  margin-left: 0px;
}
.timeline_card .btn_vote:before {
  left: 10%;
  margin-top: -2px;
}
.timeline_card .btn_vote .popup_vote_user {
  position: absolute;
  bottom: 44px;
  left: 0px;
  z-index: 100;
  overflow: auto;
  box-sizing: border-box;
  max-height: 240px;
  width: 256px;
  box-shadow: 4px 4px 4px 4px rgba(0, 0, 0, 0.4);
  border-radius: 3px;
  background: #fff;
  color: #000;
  text-align: left;
  cursor: auto;
}
.timeline_card .btn_vote .popup_vote_user .header {
  font-size: 14px;
  padding: 6px 10px;
}
.timeline_card .btn_vote .popup_vote_user ul {
  clear: both;
}
.timeline_card .btn_vote .popup_vote_user ul li {
  border-top: 1px solid #eee;
  color: #000;
  font-size: 12px;
  line-height: 20px;
  padding: 8px 10px;
}
.timeline_card .btn_vote .popup_vote_user ul li a {
  color: #000;
}
.timeline_card .btn_vote .popup_vote_user ul li a img {
  width: 20px;
  height: 20px;
  margin-right: 8px;
}
.timeline_card .comment_area {
  background-color: #F6F7F9;
}
#mg-sp .timeline_card .header {
  height: auto !important;
  padding: 18px;
}
#mg-sp .timeline_card .header table .icon_area {
  width: 96px;
}
#mg-sp .timeline_card .header table .icon_area img {
  width: 72px;
  height: 72px;
}
#mg-sp .timeline_card .header table .icon_area img.user_icon {
  top: 28px;
  left: 38px;
  width: 44px !important;
  height: 44px !important;
}
#mg-sp .timeline_card .header table .contribute_info_area {
  max-width: 216px;
}
#mg-sp .timeline_card .header table .contribute_info_area .contributor {
  font-size: 24px;
}
#mg-sp .timeline_card .header table .contribute_info_area .contributor a .name {
  font-size: 20px;
}
#mg-sp .timeline_card .header table .contribute_info_area .created_at {
  font-size: 20px;
  padding-top: 8px;
}
#mg-sp .timeline_card .header table .status_area {
  font-size: 20px;
}
#mg-sp .timeline_card .header table .config_area {
  width: 56px;
}
#mg-sp .timeline_card .header table .config_area .config_button_area {
  width: 52px;
}
#mg-sp .timeline_card .content_body h2 {
  margin-bottom: 20px !important;
  line-height: 34px !important;
  font-size: 32px !important;
  font-weight: normal !important;
  font-size: 36px;
  margin: 10px 0;
}
#mg-sp .timeline_card .content_body .caption {
  font-size: 22px;
}
#mg-sp .timeline_card .btn_vote {
  width: 180px;
  font-size: 20px;
}
#mg-sp .timeline_card .btn_vote:before {
  left: 8%;
  margin-top: -2px;
}
#mg-sp .timeline_card .comment_area .comment_display_area {
  font-size: 24px;
}.info_panel {
  position: relative;
  /*overflow: hidden;*/
  background: #fff;
  box-sizing: border-box;
  border-radius: 6px;
  margin-bottom: 20px;
  padding: 12px 12px 0 12px;
  width: 640px;
}
.info_panel .right_top_area {
  position: absolute;
  top: 12px;
  right: 16px;
  z-index: 100;
  text-align: right;
}
.info_panel .right_top_area .config_button_area {
  float: right;
  display: inline-block;
  margin: -2px -6px 6px 4px;
}
.info_panel .right_top_area .follows_num {
  clear: both;
  margin: 8px 2px 0 0;
  color: #333;
}
.info_panel .right_top_area .follows_num a {
  color: #999;
}
.info_panel .right_top_area .follows_num a:hover {
  text-decoration: underline;
  color: #0099ff;
}
.info_panel .right_top_area .btn_follow {
  display: inline-block;
}
.info_panel .info_inner {
  min-height: 174px;
}
.info_panel .info_inner .left {
  position: relative;
}
.info_panel .info_inner .left .icon_image {
  position: relative;
}
.info_panel .info_inner .left .icon_image img {
  width: 150px;
  height: 150px;
}
.info_panel .info_inner .left .icon_image img.editable:hover {
  opacity: 0.7;
  cursor: pointer;
}
.info_panel .info_inner .left .icon_image .edit_icon {
  position: absolute;
  top: 6px;
  right: 6px;
  font-size: 20px;
  color: #fff;
  text-shadow: 1px 1px 1px #aaa;
}
.info_panel .info_inner .left .sub_information {
  position: absolute;
  z-index: 100;
  margin-top: 8px;
  width: 150px;
  min-height: 28px;
  text-align: center;
}
.info_panel .info_inner .left .sub_information .message {
  margin-top: -4px;
  font-size: 20px;
  cursor: pointer;
  background-color: #32cbfd;
  color: #FFF;
  border-radius: 3px;
  height: 25px;
}
.info_panel .info_inner .left .sub_information .competition_status {
  width: 150px;
  margin-bottom: 6px;
}
.info_panel .info_inner .right {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  margin-left: 150px;
  margin-bottom: 15px;
  padding: 0 12px 4px 12px;
  min-height: 150px;
  max-height: 150px;
  transition: max-height 0.5s ease;
}
.info_panel .info_inner .right section {
  margin-bottom: 16px;
  max-width: 312px;
}
.info_panel .info_inner .right .username_area p.nickname {
  margin: 2px 0;
  font-size: 24px;
}
.info_panel .info_inner .right .username_area p.name {
  margin: 0;
  font-size: 16px;
}
.info_panel .info_inner .right .username_area p.organizer, .info_panel .info_inner .right .username_area p.site_url {
  margin: 6px 0 0 0;
}
.info_panel .info_inner .right .username_area p.organizer a, .info_panel .info_inner .right .username_area p.site_url a {
  color: #0099ff !important;
}
.info_panel .info_inner .right .username_area a {
  color: #333;
}
.info_panel .info_inner .right .profile {
  position: relative;
  overflow: hidden;
  max-height: 48px;
}
.info_panel .info_inner .right .profile.hidden::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 50;
  width: 100%;
  height: 50%;
  background: linear-gradient(rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.7) 20%, rgb(255, 255, 255) 80%);
}
.info_panel .info_inner .right .more {
  position: absolute;
  right: 6px;
  bottom: 0px;
  z-index: 99;
  color: #0099ff;
  cursor: pointer;
}
.info_panel .info_inner .right .more:hover {
  opacity: 0.7;
}
.info_panel .info_inner .right .more .fa {
  position: relative;
  top: 2px;
  margin-right: 2px;
  font-size: 20px;
}
.info_panel .info_inner .right .more.close {
  bottom: -20px !important;
}
.info_panel .info_inner .right .profile_more {
  display: none;
}
.info_panel .info_inner .right .profile_more table tr th {
  padding: 6px 0;
  width: 80px;
}
.info_panel .info_inner .right .profile_more .clause {
  margin-top: 36px;
}
.info_panel .info_inner .right .profile_more .clause h3 {
  border-left: 4px solid #ff9900;
  margin: 0 0 8px 0;
  padding-left: 6px;
  font-size: 18px;
  font-weight: normal;
  line-height: 24px;
}
.info_panel .info_inner .right .profile_more .clause table.schedule th, .info_panel .info_inner .right .profile_more .clause table.share th {
  padding: 6px 20px 6px 0;
  white-space: nowrap;
}
.info_panel .info_inner .right .profile_more .clause table.schedule td, .info_panel .info_inner .right .profile_more .clause table.share td {
  padding: 6px 0;
}
.info_panel .info_inner .right .profile_more .clause .share .btn_twitter, .info_panel .info_inner .right .profile_more .clause .share .btn_fb {
  height: 36px;
  line-height: 36px;
}
.info_panel .info_inner .right .profile_more .clause .share .btn_twitter {
  margin: 0;
}
.info_panel .info_inner .right .profile_more .clause .share .share_code {
  border: 1px solid #ccc;
  margin-top: 4px;
  padding: 3px;
  width: 100%;
  line-height: 16px;
  resize: none;
}
.info_panel .info_inner .btn_area {
  position: relative;
  margin-top: 6px;
  min-height: 48px;
  text-align: center;
}
.info_panel .info_inner .btn_area .btn {
  display: inline-block;
  border-radius: 6px;
  margin: 0 auto;
  width: 200px;
  height: 44px;
  text-align: center;
  font-size: 14px;
  line-height: 44px;
  cursor: pointer;
}
.info_panel .info_inner .btn_area .btn_submit {
  background-color: #35d0e5;
  color: #fff;
}
.info_panel .info_inner .btn_area .btn_submit:hover {
  text-decoration: none;
  opacity: 0.7;
}
.info_panel .info_inner .btn_area .btn_disabled {
  background-color: #eee;
  color: #333;
  cursor: default;
}
.info_panel .loading {
  padding-bottom: 12px;
}
.info_panel .loading .left_side {
  float: left;
  width: 150px;
}
.info_panel .loading .left_side .icon_image {
  background-color: #f0f0f0;
  width: 150px;
  height: 150px;
}
.info_panel .loading .left_side .status_area {
  background-color: #f0f0f0;
  width: 100%;
  height: 24px;
  margin: 8px 0;
}
.info_panel .loading .right_side {
  float: left;
  padding-left: 12px;
  width: 454px;
}
.info_panel .loading .right_side .name_area .primary_name, .info_panel .loading .right_side .name_area .secondary_name {
  box-sizing: border-box;
  background-color: #f0f0f0;
  margin-bottom: 4px;
}
.info_panel .loading .right_side .name_area .primary_name {
  width: 240px;
  height: 28px;
}
.info_panel .loading .right_side .name_area .secondary_name {
  width: 160px;
  height: 20px;
}
.info_panel .loading .right_side .profile_area {
  margin-top: 20px;
}
.info_panel .loading .right_side .profile_area .profile_line {
  background-color: #f0f0f0;
  margin: 0 0 8px 0;
  width: 100%;
  height: 16px;
}
#mg-sp .info_panel {
  border-radius: inherit;
  padding: 8px 8px 0 8px;
  font-size: 22px;
  overflow: hidden;
}
#mg-sp .info_panel .right_top_area {
  top: 8px;
}
#mg-sp .info_panel .right_top_area .config_button_area {
  margin: 0 12px 6px 8px;
}
#mg-sp .info_panel .info_inner .left .icon_image .edit_icon {
  font-size: 24px;
}
#mg-sp .info_panel .info_inner .left .sub_information .message {
  font-size: 26px;
  height: 32px;
}
#mg-sp .info_panel .info_inner .left .sub_information .competition_status {
  height: 34px;
  line-height: 34px;
  font-size: 18px;
}
#mg-sp .info_panel .info_inner .right {
  min-height: 280px;
  max-height: 280px;
}
#mg-sp .info_panel .info_inner .right section:not(:last-of-type) {
  margin-bottom: 20px;
  max-width: 224px;
}
#mg-sp .info_panel .info_inner .right .username_area p.nickname {
  font-size: 32px;
}
#mg-sp .info_panel .info_inner .right .username_area p.name {
  font-size: 24px;
}
#mg-sp .info_panel .info_inner .right .username_area a {
  color: #333;
}
#mg-sp .info_panel .info_inner .right .profile {
  max-height: 92px;
  line-height: 26px;
}
#mg-sp .info_panel .info_inner .right .profile.hidden::after {
  height: 32%;
}
#mg-sp .info_panel .info_inner .right .more .fa {
  font-size: 30px;
}
#mg-sp .info_panel .info_inner .right .more.close {
  bottom: -30px !important;
}
#mg-sp .info_panel .info_inner .right .profile_more .clause h3 {
  font-size: 26px;
  line-height: 36px;
}
#mg-sp .info_panel .info_inner .right .profile_more .clause table.schedule th, #mg-sp .info_panel .info_inner .right .profile_more .clause table.schedule td, #mg-sp .info_panel .info_inner .right .profile_more .clause table.share th, #mg-sp .info_panel .info_inner .right .profile_more .clause table.share td {
  display: block;
}
#mg-sp .info_panel .info_inner .right .profile_more .clause table.schedule th, #mg-sp .info_panel .info_inner .right .profile_more .clause table.share th {
  padding: 0 0 8px 0;
  white-space: nowrap;
}
#mg-sp .info_panel .info_inner .right .profile_more .clause table.schedule td, #mg-sp .info_panel .info_inner .right .profile_more .clause table.share td {
  padding: 0 0 12px 16px !important;
}
#mg-sp .info_panel .info_inner .right .profile_more .clause .share .btn_twitter, #mg-sp .info_panel .info_inner .right .profile_more .clause .share .btn_fb {
  height: 36px;
  line-height: 36px;
}
#mg-sp .info_panel .info_inner .right .profile_more .clause .share .btn_twitter {
  margin: 0;
}
#mg-sp .info_panel .info_inner .right .profile_more .clause .share .share_code {
  box-sizing: border-box;
  margin-top: 4px;
  padding: 4px;
  width: 100%;
  height: 80px;
  line-height: 24px;
}
#mg-sp .info_panel .info_inner .btn_area {
  margin-top: 12px;
}
#mg-sp .info_panel .info_inner .btn_area .btn {
  width: 240px;
  height: 60px;
  line-height: 60px;
  font-size: 22px;
}
#mg-sp .info_panel .loading .left_side .status_area {
  height: 32px;
  margin: 8px 0;
}
#mg-sp .info_panel .loading .right_side .name_area .primary_name, #mg-sp .info_panel .loading .right_side .name_area .secondary_name {
  margin-bottom: 12px;
}
#mg-sp .info_panel .loading .right_side .name_area .primary_name {
  width: 280px;
  height: 36px;
}
#mg-sp .info_panel .loading .right_side .name_area .secondary_name {
  width: 200px;
  height: 28px;
}
#mg-sp .info_panel .loading .right_side .profile_area .profile_line {
  margin: 0 0 10px 0;
  width: 100%;
  height: 24px;
}