input,
select,
textarea,
button {
	padding: 9px 10px;
	background: #f3f3f3;
	width: 100%;
	border: 1px solid #d2d2d2;
	outline: none;
}
input[type=radio],
input[type=checkbox] {
	padding: 0;
	width: auto;
	position: relative;
	top: 2px;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}
textarea {
	min-height: 130px;
	resize: none;
}
#mail button {
	cursor: pointer;	
	display: inline-block;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
    color: #000;  
  
}
#mail button:hover{
  color: #fff;
}
label {
	display: block;
}
#mail .row > .col {
	padding-bottom: 22px;
}
#mail .mark-require {
  width: 45px;
  height: 26px;
  background: #a15228;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  right: 10px;
  top: 0;  
  font-size: 11px;
}
#mail .submit {
	text-align: center;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: flex-start;
  margin-top: 30px;
}
/**************************************************
 *  _____ ____ __  __       _ _
 * |  ___/ ___|  \/  | __ _(_) | ___ _ __
 * | |_ | |   | |\/| |/ _` | | |/ _ \ '__|
 * |  _|| |___| |  | | (_| | | |  __/ |
 * |_|   \____|_|  |_|\__,_|_|_|\___|_|
 *
 **************************************************
 *
 * FCMailer - 2017
 *
 * StyleName: FCMailer.css
 *
 * PackageName: FCMailer
 * Version: 3.9.6
 *
 * FoodConnection
 * http://foodconnection.jp/
 * http://foodconnection.vn/
 *
 ***************************************************/


.fc-form {
    transition: none;
    -moz-transition: none;
    -webkit-transition: none;
}

.fc-form * {
    transition: none;
    -moz-transition: none;
    -webkit-transition: none;
}

.fc-form .parse-line label {
    display: inline-block;
}

.fc-form .confirm-show {
    display: none;
}

.fc-form .form-row {
    position: relative;
}

.fc-form .form-value {
    position: relative;
}

.fc-form button {
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

.fc-form .form-submit {
  padding: 0;
}
#mail .fc-form .col.submit-form{
  margin-top: 0;
}
.fc-form .form-submit i{
  width: 98px;
}

.fc-form [class^='error'] {
    display: none;
    color: #F44336;
    font-weight: 600;
    position: absolute;
    left: 0;
    bottom: 0;
}

.fc-form .submit-confirm {
    display: none !important;
}

.fc-confirm {
    display: none;
    margin: auto;
    transition: none;
    -moz-transition: none;
    -webkit-transition: none;
}

.fc-confirm * {
    transition: none;
    -moz-transition: none;
    -webkit-transition: none;
}

.fc-confirm.display-fixed {
    background: rgba(0, 0, 0, .8) !important;
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
}

body.confirm-fixed {
    pointer-events: none !important;
    overflow: hidden !important;
}

.fc-confirm [class^='error'] {
    display: none !important;
}

.fc-confirm.display-fixed .confirm-main {
    pointer-events: visible !important;
    margin-right: -50%;
    padding: 1.5em;
    color: #BFBFBF;
    background: rgba(0, 0, 0, .5);
    width: 100%;
    max-width: 1000px;
    max-height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    box-shadow: 0 0 5px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(255, 255, 255, .15), inset 0 0 0 2px rgba(0, 0, 0, .5);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(255, 255, 255, .15), inset 0 0 0 2px rgba(0, 0, 0, .5);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(255, 255, 255, .15), inset 0 0 0 2px rgba(0, 0, 0, .5);
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    overflow: hidden;
    overflow-y: visible;
}

.fc-confirm input,
.fc-confirm select,
.fc-confirm textarea {
    cursor: default;
}

.fc-confirm .confirm-value {
    display: inline-block;
}

.fc-confirm .confirm-empty {
    opacity: 0;
    cursor: not-allowed;
    color: rgba(0, 0, 0, .3) !important;
}

.fc-form[data-debug='true']+.fc-confirm .confirm-empty {
    opacity: 1;
}

.fc-confirm .confirm-hide {
    display: none !important;
}

.fc-confirm .form-attachment .attachment-button,
.fc-confirm .form-attachment .attachment-remove {
    display: none !important;
}

.fc-confirm .confirm-show {
    display: block;
}

.fc-confirm .submit-confirm+.submit-form {
    display: none !important;
}

.fc-confirm button {
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

body.debugger {
    overflow: hidden !important;
}

#fc-debug {
    pointer-events: visible !important;
    opacity: 0;
    margin: auto;
    color: #303030;
    font-size: 12px;
    font-family: arial, verdana, tahoma, sans-serif, serif;
    line-height: 1.428571429;
    letter-spacing: 0;
    text-align: initial;
    background: rgba(0, 0, 0, .5);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    visibility: hidden;
    z-index: 99999;
}

body.debugger #fc-debug {
    opacity: 1;
    visibility: visible;
}

#fc-debug * {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

#fc-debug .debug-main {
    background: #FEFEFE;
    color: #303030;
    width: 800px;
    min-height: 450px;
    position: absolute;
    top: 0;
    right: -800px;
    bottom: 0;
    box-shadow: -3px 0 3px rgba(0, 0, 0, .7);
    -moz-box-shadow: -3px 0 3px rgba(0, 0, 0, .7);
    -webkit-box-shadow: -3px 0 3px rgba(0, 0, 0, .7);
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    overflow: hidden;
    /* overflow-y: auto; */
}

body.debugger #fc-debug .debug-main {
    right: 0;
}

#fc-debug .debug-head {
    margin: 0 0 10px;
}

#fc-debug .debug-menu {
    min-height: 45px;
    position: relative;
    z-index: 2;
}

#fc-debug .debug-close {
    cursor: pointer;
    margin: auto;
    color: #FEFEFE;
    font-size: 25px;
    /* font-family: fantasy, tahoma, verdana, arial, sans-serif, serif; */
    line-height: 25px;
    text-align: center;
    background: #F55A4E;
    width: 25px;
    height: 25px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: absolute;
    top: 10px;
    right: 10px;
    box-shadow: inset 0 0 0 1px #FEFEFE, 0 0 3px rgba(0, 0, 0, .3);
    -moz-box-shadow: inset 0 0 0 1px #FEFEFE, 0 0 3px rgba(0, 0, 0, .3);
    -webkit-box-shadow: inset 0 0 0 1px #FEFEFE, 0 0 3px rgba(0, 0, 0, .3);
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    z-index: 2;
}

#fc-debug .debug-menu>.debug-close {
    top: 0;
    bottom: 0;
}

#fc-debug .debug-close:hover {
    background: #F32B1E;
}

#fc-debug .debug-menu .debug-local {
    margin: auto;
    color: #009688;
    font-size: 15px;
    font-weight: 600;
    font-variant: small-caps;
    line-height: 1;
    position: absolute;
    top: 50%;
    right: 50px;
    transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}

#fc-debug .debug-menu .debug-local>* {
    display: inline-block;
    margin-left: 5px;
    padding: 5px 10px;
    color: #FEFEFE;
    font-size: 12px;
    font-weight: 500;
    font-variant: normal;
    text-transform: uppercase;
    line-height: 1;
    background: #2196F3;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 0 0 0 1px #0C7CD6;
    -moz-box-shadow: 0 0 0 1px #0C7CD6;
    -webkit-box-shadow: 0 0 0 1px #0C7CD6;
}

#fc-debug .debug-tab {
    padding: 10px 20px;
    background: #EFEFEF;
    box-shadow: inset 0 -1px #DFDFDF;
    -moz-box-shadow: inset 0 -1px #DFDFDF;
    -webkit-box-shadow: inset 0 -1px #DFDFDF;
}

#fc-debug .debug-tab>* {
    cursor: pointer;
    display: inline-block;
    padding: 5px 10px;
    color: #AFAFAF;
    font-size: 16px;
    text-align: center;
    background: #FEFEFE;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: relative;
    box-shadow: inset 0 0 0 1px #CFCFCF, 0 0 3px rgba(0, 0, 0, .1);
    -moz-box-shadow: inset 0 0 0 1px #CFCFCF, 0 0 3px rgba(0, 0, 0, .1);
    -webkit-box-shadow: inset 0 0 0 1px #CFCFCF, 0 0 3px rgba(0, 0, 0, .1);
    transform: translateZ(0);
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#fc-debug .debug-tab>*:hover,
#fc-debug .debug-tab>*.active {
    color: #FEFEFE;
    background: #BFBFBF;
    box-shadow: inset 0 0 0 1px #BFBFBF, inset 0 0 0 2px #FEFEFE, 0 0 1px rgba(0, 0, 0, .1);
    -moz-box-shadow: inset 0 0 0 1px #BFBFBF, inset 0 0 0 2px #FEFEFE, 0 0 1px rgba(0, 0, 0, .1);
    -webkit-box-shadow: inset 0 0 0 1px #BFBFBF, inset 0 0 0 2px #FEFEFE, 0 0 1px rgba(0, 0, 0, .1);
}

#fc-debug .debug-tab>*+* {
    margin-left: 15px;
}

#fc-debug .debug-button {
    margin-right: 20px;
    padding: 5px 20px;
    color: #FEFEFE;
    font-weight: 600;
    font-variant: small-caps;
    letter-spacing: 1px;
    background: #3F51B5;
    box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 2px #FEFEFE, 0 0 1px rgba(0, 0, 0, .1);
    -moz-box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 2px #FEFEFE, 0 0 1px rgba(0, 0, 0, .1);
    -webkit-box-shadow: inset 0 0 0 1px #3F51B5, inset 0 0 0 2px #FEFEFE, 0 0 1px rgba(0, 0, 0, .1);
}

#fc-debug .debug-button:before {
    content: "";
    margin: auto;
    background: #795548;
    width: 1px;
    position: absolute;
    top: 1px;
    right: -18px;
    bottom: 1px;
    box-shadow: 3px 0 #795548, -3px 0 #795548;
    -moz-box-shadow: 3px 0 #795548, -3px 0 #795548;
    -webkit-box-shadow: 3px 0 #795548, -3px 0 #795548;
}

#fc-debug .debug-button:hover {
    background: #673AB7;
    box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 2px #FEFEFE, 0 0 1px rgba(0, 0, 0, .1);
    -moz-box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 2px #FEFEFE, 0 0 1px rgba(0, 0, 0, .1);
    -webkit-box-shadow: inset 0 0 0 1px #673AB7, inset 0 0 0 2px #FEFEFE, 0 0 1px rgba(0, 0, 0, .1);
}

#fc-debug .debug-url {
    margin: auto;
    padding: 5px 20px;
    font-size: 125%;
    background: #F0F0F0;
    position: relative;
    box-shadow: inset 0 1px #FEFEFE, inset 0 -1px #DFDFDF, inset 0 -2px #FEFEFE;
    -moz-box-shadow: inset 0 1px #FEFEFE, inset 0 -1px #DFDFDF, inset 0 -2px #FEFEFE;
    -webkit-box-shadow: inset 0 1px #FEFEFE, inset 0 -1px #DFDFDF, inset 0 -2px #FEFEFE;
    z-index: 2;
}

#fc-debug .debug-url>* {
    color: inherit;
    font-size: inherit;
    text-decoration: none;
}

#fc-debug .debug-url a {
    color: #FF5722;
    transform: translateZ(0);
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#fc-debug .debug-url a:before {
    content: "";
    display: inline-block;
    margin-right: 10px;
    width: 0;
    height: 0;
    border-left: 5px solid #FF5722;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    transform: translateZ(0);
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#fc-debug .debug-url a:hover {
    color: #009688;
}

#fc-debug .debug-url a:hover:before {
    margin: -3px 7px -3px 0;
    border-left-color: #009688;
    border-top-width: 8px;
    border-left-width: 8px;
    border-bottom-width: 8px;
}

#fc-debug .debug-url .debug-path-config {
    margin: auto;
    position: absolute;
    top: 0;
    right: 10px;
    bottom: 0;
}

#fc-debug .debug-url .debug-path-config *+* {
    margin-left: 10px;
}

#fc-debug .debug-url small {
    display: inline-block;
    padding: 0 5px;
    color: #FEFEFE;
    font-size: 12px;
    font-weight: 600;
    font-family: Consolas, Menlo, Monaco, Courier, "Courier New", monospace, sans-serif, serif;
    line-height: 20px;
    letter-spacing: .25px;
    height: 20px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: relative;
    top: 3px;
}

#fc-debug .debug-url small:before {
    margin-right: 5px;
}

#fc-debug .debug-url .debug-path-missing {
    font-style: italic;
    background: #F44336;
}

#fc-debug .debug-url .debug-path-missing:before {
    content: "\2717";
    font-style: normal;
}

#fc-debug .debug-url .debug-path-loaded {
    background: #8BC34A;
}

#fc-debug .debug-url .debug-path-loaded:before {
    content: "\2713";
}

#fc-debug .debug-tab-target {
    display: none;
}

#fc-debug .debug-tab-target.active {
    display: block;
}

#fc-debug .debug-mail {
    margin: 10px 0;
    padding: 0 20px;
    position: relative;
    transform: translateZ(0);
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    z-index: 1;
}

#fc-debug .debug-block {
    display: table;
    width: 100%;
}

#fc-debug .debug-block>* {
    display: table-cell;
    padding: 3px 5px;
    width: 50%;
}

#fc-debug .debug-caption {
    color: #909090;
    text-align: right;
    width: 30%;
    position: relative;
}

#fc-debug .debug-change {
    cursor: pointer;
    color: #F44336;
    font-size: 15px;
    font-weight: 600;
    line-height: 20px;
    position: absolute;
    top: 0;
    left: 50px;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    z-index: 2;
}

#fc-debug .debug-change:before {
    content: "";
    margin: auto;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgZmlsbD0icmVkIj48dGl0bGU+Rm9vZENvbm5lY3Rpb24gLSBEZXYgdGVhbTwvdGl0bGU+PHBhdGggZD0iTTQ0Ny45OTksMjU2YzAtMTItMS4yNS0yMy42NTYtMy4zNDQtMzUuMDMxbDY1LjAzMS0zNy41MzFsLTY0LTExMC44NzVsLTY1LjAzMSwzNy41NjMgYy0xNy43MTktMTUuMTI2LTM4LjI1LTI3LjAzMi02MC42NTYtMzQuOTdWMGgtMTI4djc1LjE1NmMtMjIuNDA2LDcuOTM4LTQyLjkzOCwxOS44NDQtNjAuNjU2LDM0Ljk2OUw2Ni4zMTIsNzIuNTYzbC02NCwxMTAuODc1IEw2Ny4zNDMsMjIxYy0yLjA5NCwxMS4zNDQtMy4zNDQsMjMtMy4zNDQsMzVjMCwxMS45NjksMS4yNSwyMy42MjUsMy4zNDQsMzVMMi4zMTIsMzI4LjU2Mmw2NCwxMTAuODc1bDY1LjA2My0zNy41NjIgYzE3LjcxOSwxNS4xNTYsMzguMjE5LDI3LjAzMSw2MC42MjUsMzQuOTY5VjUxMmgxMjh2LTc1LjE1NmMyMi40MDYtNy45MzgsNDIuOTM5LTE5LjgxMiw2MC42MjUtMzQuOTY5bDY1LjA2NCwzNy41NjJsNjQtMTEwLjg3NSBsLTY1LjAzMS0zNy41M0M0NDYuNzQ5LDI3OS42NTYsNDQ3Ljk5OSwyNjcuOTY5LDQ0Ny45OTksMjU2eiBNNDY1Ljk2OCwzNDAuMjgxbC0zMiw1NS40MzhsLTM3LjM0NC0yMS41NjJsLTE5LjYyNS0xMS4zMTIgbC0xNy4xODgsMTQuNzE5Yy0xNC44MTQsMTIuNzItMzEuODE0LDIyLjUtNTAuNSwyOS4xMjVsLTIxLjMxMiw3LjUzMXYyMi42MjVWNDgwaC02NHYtNDMuMTU2di0yMi42MjVsLTIxLjMxMy03LjUzMSBjLTE4LjY1Ni02LjYyNS0zNS42MjUtMTYuNDA1LTUwLjUtMjkuMTI1bC0xNy4xODctMTQuNzE5bC0xOS42MjUsMTEuMzEzTDc4LjAyOSwzOTUuNzJsLTMyLjAzMS01NS40MzhsMzcuMzQ0LTIxLjU2MyBsMTkuNTYzLTExLjMxMmwtNC4wOTQtMjIuMjJjLTEuODc1LTEwLjI0OC0yLjgxMy0xOS44MTEtMi44MTMtMjkuMTg2czAuOTM4LTE4LjkzOCwyLjgxMy0yOS4xODhsNC4wOTQtMjIuMjE5bC0xOS41NjMtMTEuMjgxIEw0NS45OTksMTcxLjc1bDMyLjAzMS01NS40NjlsMzcuMzEzLDIxLjUzMWwxOS41OTQsMTEuMzEzbDE3LjE4OC0xNC42NTZjMTQuOTM4LTEyLjc1LDMxLjkzOC0yMi41MzEsNTAuNTYzLTI5LjE1NmwyMS4zMTEtNy41NjMgVjc1LjE1NlYzMmg2NHY0My4xNTZWOTcuNzVsMjEuMzEyLDcuNTYzYzE4LjYyNSw2LjYyNSwzNS42NTYsMTYuNDA2LDUwLjU2MiwyOS4xNTZsMTcuMjE5LDE0LjY1NmwxOS41NjQtMTEuMzEzbDM3LjMxMi0yMS41MzEgbDMyLDU1LjQzOGwtMzcuMzEyLDIxLjUzMWwtMTkuNTY0LDExLjMxM2w0LjA5NiwyMi4xODhjMS45MDQsMTAuMzEyLDIuODExLDE5Ljg3NCwyLjgxMSwyOS4yNDlzLTAuOTA2LDE4LjkzOC0yLjgxMiwyOS4yNSBsLTQuMDk2LDIyLjIxOWwxOS41NjQsMTEuMjgxTDQ2NS45NjgsMzQwLjI4MXoiLz48cGF0aCBkPSJNMjU1Ljk5OSwxOTJjMzUuMjgyLDAsNjQsMjguNjg4LDY0LDY0YzAsMzUuMjgxLTI4LjcxOSw2NC02NCw2NGMtMzUuMzEzLDAtNjQtMjguNzE5LTY0LTY0IEMxOTEuOTk5LDIyMC42ODgsMjIwLjY4NywxOTIsMjU1Ljk5OSwxOTIgTTI1NS45OTksMTYwYy01MywwLTk2LDQzLTk2LDk2czQzLDk2LDk2LDk2YzUzLDAsOTYtNDMsOTYtOTZTMzA4Ljk5OSwxNjAsMjU1Ljk5OSwxNjAgTDI1NS45OTksMTYweiIvPjwvc3ZnPg==) no-repeat center;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    left: -30px;
    bottom: 0;
}

#fc-debug .debug-change:after {
    content: "0";
    margin-left: 10px;
    padding: 3px 5px;
    color: #FEFEFE;
    font-size: 11px;
    line-height: 1;
    background: #00BCD4;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: absolute;
    top: -5px;
    left: 100%;
}

#fc-debug .debug-change[data]:after {
    content: attr(data);
}

#fc-debug .debug-change:hover {
    opacity: .75;
}

#fc-debug .debug-config {
    margin: auto;
    opacity: 0;
    padding: 50px 10px 10px;
    background: rgba(255, 255, 255, .9);
    width: 500px;
    position: absolute;
    top: -10px;
    left: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    visibility: hidden;
    z-index: 1;
}

#fc-debug .debug-config.active {
    opacity: 1;
    visibility: visible;
}

#fc-debug .debug-config .d-config-button {
    cursor: pointer;
    margin: auto;
    padding: 5px 10px;
    color: #FEFEFE;
    font-variant: small-caps;
    line-height: 1;
    background: #FF5722;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: absolute;
    top: 15px;
    right: 15px;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#fc-debug .debug-config .d-config-button:hover {
    background: #F44336;
}

#fc-debug .debug-config .d-config-main {
    max-height: 200px;
    overflow: auto;
}

#fc-debug .debug-config .d-config-main::-webkit-scrollbar {
    background: rgba(255, 255, 255, .25);
}

#fc-debug .debug-config .d-config-main::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, .2);
}

#fc-debug .debug-config .d-config-main::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, .05);
}

#fc-debug .debug-config .d-config-main hr {
    margin: 10px 5px 10px 10px;
    border: none;
    border-top: 1px dashed #909090;
}

#fc-debug .debug-config .d-config-block {
    padding: 0 5px;
    position: relative;
}

#fc-debug .debug-config .d-config-block+.d-config-block {
    margin-top: 10px;
}

#fc-debug .debug-config .d-config-remove,
#fc-debug .debug-config .d-config-select {
    cursor: pointer;
    margin: auto;
    padding: 3px;
    color: #FEFEFE;
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    line-height: 20px;
    background: #607D8B;
    width: 25px;
    height: 25px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: absolute;
    top: 0;
    left: 10px;
    bottom: 0;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#fc-debug .debug-config .d-config-remove:hover,
#fc-debug .debug-config .d-config-select:hover {
    background: #7A96A3;
}

#fc-debug .debug-config .d-config-add {}

#fc-debug .debug-config .d-config-add .d-config-block:last-child .d-config-remove {
    cursor: not-allowed;
    opacity: .25;
}

#fc-debug .debug-config .d-config-select label {
    cursor: pointer;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

#fc-debug .debug-config .d-config-select input {
    cursor: pointer;
    opacity: 0;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

#fc-debug .debug-config .d-config-select span {
    margin: auto;
    opacity: .25;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#fc-debug .debug-config .d-config-select input:checked~span {
    opacity: 1;
}

#fc-debug .debug-config .d-config-select span:before {
    content: "";
    margin: auto;
    width: 3px;
    height: 6px;
    border: 0 solid #FEFEFE;
    border-right-width: 2px;
    border-bottom-width: 2px;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    position: absolute;
    top: -3px;
    left: 0;
    right: 0;
    bottom: 0;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#fc-debug .debug-config .d-config-input {
    margin-left: 40px;
    padding: 5px 10px;
    color: #606060;
    font-size: 12px;
    line-height: 15px;
    background: #FEFEFE;
    height: 25px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: inset 0 0 0 1px #909090;
    -moz-box-shadow: inset 0 0 0 1px #909090;
    -webkit-box-shadow: inset 0 0 0 1px #909090;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    overflow: hidden;
}

#fc-debug .debug-config .d-config-block.selected .d-config-input {
    color: #009688;
    background: #F3FFE4;
    box-shadow: inset 0 0 0 1px #009688;
    -moz-box-shadow: inset 0 0 0 1px #009688;
    -webkit-box-shadow: inset 0 0 0 1px #009688;
}

#fc-debug .debug-config .d-config-input input {
    padding: 0 !important;
    color: #606060 !important;
    font-size: 12px !important;
    font-family: sans-serif, serif;
    background: transparent !important;
    height: 15px !important;
    min-height: auto !important;
    border: none !important;
    box-shadow: none !important;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    position: relative !important;
    top: -1px !important;
}

#fc-debug .debug-config .d-config-input input:-moz-placeholder {
    opacity: 1;
    color: #C9C9C9;
    position: relative;
    left: 0;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    visibility: visible;
}

#fc-debug .debug-config .d-config-input input::-moz-placeholder {
    opacity: 1;
    color: #C9C9C9;
    position: relative;
    left: 0;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    visibility: visible;
}

#fc-debug .debug-config .d-config-input input::-webkit-input-placeholder {
    opacity: 1;
    color: #C9C9C9;
    position: relative;
    left: 0;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    visibility: visible;
}

#fc-debug .debug-config .d-config-input input:focus:not(:read-only):not(:disabled):-moz-placeholder {
    opacity: 0;
    left: 5%;
    visibility: hidden;
}

#fc-debug .debug-config .d-config-input input:focus:not(:read-only):not(:disabled)::-moz-placeholder {
    opacity: 0;
    left: 5%;
    visibility: hidden;
}

#fc-debug .debug-config .d-config-input input:focus:not(:read-only):not(:disabled)::-webkit-input-placeholder {
    opacity: 0;
    left: 5%;
    visibility: hidden;
}

#fc-debug .debug-value {
    color: #607D8B;
    font-family: "メイリオ", Meiryo, "ヒラギノ角ゴシックPro", "ＭＳ ゴシック", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    width: 70%;
}

#fc-debug .debug-value mark {
    display: inline-block;
    margin: -3px 0;
    padding: 5px 10px;
    color: #FEFEFE;
    font-weight: 600;
    line-height: 1;
    background: #FF9800;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: inset 0 0 0 1px #FF9800, inset 0 0 0 2px #FEFEFE;
    -moz-box-shadow: inset 0 0 0 1px #FF9800, inset 0 0 0 2px #FEFEFE;
    -webkit-box-shadow: inset 0 0 0 1px #FF9800, inset 0 0 0 2px #FEFEFE;
}

#fc-debug .debug-value .email-test {
    display: block;
    color: #F44336;
}

#fc-debug .debug-subject {
    margin: 10px 20px;
    padding: 5px 10px;
    color: #FEFEFE;
    font-size: 150%;
    font-weight: 600;
    font-family: "メイリオ", Meiryo, "ヒラギノ角ゴシックPro", "ＭＳ ゴシック", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    background: #607D8B;
    box-shadow: inset 0 0 0 1px #607D8B, inset 0 0 0 2px #FEFEFE;
    -moz-box-shadow: inset 0 0 0 1px #607D8B, inset 0 0 0 2px #FEFEFE;
    -webkit-box-shadow: inset 0 0 0 1px #607D8B, inset 0 0 0 2px #FEFEFE;
    transform: translateZ(0);
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
}

#fc-debug .debug-content {
    margin: auto;
    opacity: 0;
    background: #FEFEFE;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: opacity 1s ease-in, top .1s ease-out;
    -moz-transition: opacity 1s ease-in, top .1s ease-out;
    -webkit-transition: opacity 1s ease-in, top .1s ease-out;
}

#fc-debug .debug-content.active {
    opacity: 1;
}

#fc-debug .debug-segment {
    display: none;
    margin: auto;
    padding: 10px 20px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

#fc-debug .debug-segment.active {
    display: block;
}

#fc-debug .debug-segment>* {
    display: none;
    margin: auto;
    width: 100%;
    height: 100%;
    position: relative;
}

#fc-debug .debug-segment>*.active {
    display: block;
}

#fc-debug .debug-segment>*:before,
#fc-debug .debug-segment>*:after {
    pointer-events: none;
    opacity: 0;
    margin: auto;
    position: absolute;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#fc-debug .debug-segment>*:before {
    content: "";
    background: rgba(0, 0, 0, .3);
    top: 50%;
    left: 50%;
    right: 50%;
    bottom: 50%;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .25), inset 0 0 0 2px rgba(255, 255, 255, .25);
    -moz-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .25), inset 0 0 0 2px rgba(255, 255, 255, .25);
    -webkit-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .25), inset 0 0 0 2px rgba(255, 255, 255, .25);
    z-index: 1;
}

#fc-debug .debug-segment.unavailable.active>*.active:before {
    opacity: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

#fc-debug .debug-segment>*:after {
    content: "inactive";
    font-size: 0;
    font-weight: 600;
    font-family: sans-serif;
    letter-spacing: 1px;
    text-align: center;
    text-shadow: 0 0 25px rgba(255, 255, 255, .25), 0 10px 25px rgba(255, 255, 255, .25), 10px 0 25px rgba(255, 255, 255, .25), 0 -10px 25px rgba(255, 255, 255, .25), -10px 0 25px rgba(255, 255, 255, .25), 10px 10px 25px rgba(255, 255, 255, .25);
    text-transform: uppercase;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    z-index: 2;
}

#fc-debug .debug-segment.unavailable.active>*.active:after {
    opacity: .5;
    color: rgba(245, 65, 55, .5);
    font-size: 1000%;
}

#fc-debug .debug-switch {
    cursor: pointer;
    opacity: .1;
    margin: auto;
    padding: 3px 5px;
    color: #303030;
    line-height: 1;
    background: #DFDFDF;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: absolute;
    top: 0;
    right: 0;
    box-shadow: 0 0 0 1px #CFCFCF;
    -moz-box-shadow: 0 0 0 1px #CFCFCF;
    -webkit-box-shadow: 0 0 0 1px #CFCFCF;
    transform: translateZ(0);
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    z-index: 1;
}

#fc-debug .debug-segment>*:hover .debug-switch {
    opacity: 1;
    color: #4CAF50;
    background: #F3F3F3;
    box-shadow: 0 0 0 1px #DCDCDC;
    -moz-box-shadow: 0 0 0 1px #DCDCDC;
    -webkit-box-shadow: 0 0 0 1px #DCDCDC;
}

#fc-debug iframe {
    margin: auto;
    width: 100%;
    height: 100%;
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

#fc-debug pre {
    margin: auto;
    font-family: Consolas, Menlo, Monaco, Courier, "Courier New", monospace, sans-serif, serif;
    white-space: pre-line;
    word-wrap: break-word;
    word-break: break-all;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    overflow-y: auto;
}

#fc-debug pre::-webkit-scrollbar {
    background: none;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

#fc-debug pre:hover::-webkit-scrollbar {
    background: #F0F0F0;
}

#fc-debug pre::-webkit-scrollbar-thumb {
    background: none;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

#fc-debug pre:hover::-webkit-scrollbar-thumb {
    background: #BFBFBF;
}

#fc-debug pre::-webkit-scrollbar-track {
    background: none;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

#fc-debug pre:hover::-webkit-scrollbar-track {
    background: #EFEFEF;
}

#fc-debug .debug-attachment {
    margin: auto;
    padding: 10px;
    background: #EFEFEF;
    max-width: 210px;
    max-height: 115px;
    position: absolute;
    top: 100px;
    right: 10px;
    box-shadow: inset 0 0 0 1px #EFEFEF, inset 0 0 0 2px #FEFEFE;
    -moz-box-shadow: inset 0 0 0 1px #EFEFEF, inset 0 0 0 2px #FEFEFE;
    -webkit-box-shadow: inset 0 0 0 1px #EFEFEF, inset 0 0 0 2px #FEFEFE;
    overflow: hidden;
    overflow-y: auto;
    z-index: 1;
}

#fc-debug .debug-attachment::-webkit-scrollbar {
    background: #BFBFBF;
}

#fc-debug .debug-attachment::-webkit-scrollbar-thumb {
    background: #909090;
}

#fc-debug .debug-attachment::-webkit-scrollbar-track {
    background: #E3E3E3;
}

#fc-debug .debug-attach-item {
    display: inline-block;
    margin: 10px;
    background: rgba(0, 0, 0, .15);
    width: 70px;
    height: 70px;
    position: relative;
}

#fc-debug .debug-attach-item:before {
    content: "";
    margin: auto;
    background: rgba(0, 0, 0, .15);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

#fc-debug .debug-attach-item[data]:after {
    content: attr(data);
    margin: auto;
    padding: 3px 5px;
    color: #DFDFDF;
    font-size: 11px;
    font-weight: 500;
    font-family: sans-serif;
    text-align: center;
    text-transform: uppercase;
    line-height: 15px;
    background: rgba(0, 0, 0, .5);
    width: 30px;
    height: 15px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    box-shadow: 0 0 3px rgba(255, 255, 255, .95);
    -moz-box-shadow: 0 0 3px rgba(255, 255, 255, .95);
    -webkit-box-shadow: 0 0 3px rgba(255, 255, 255, .95);
    overflow: hidden;
    z-index: 2;
}

#fc-debug .debug-attach-item img {
    margin: auto;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

#fc-messages-error {
    opacity: 0;
    margin: auto;
    color: #909090;
    font-size: 12px;
    line-height: 1.428571429;
    letter-spacing: 0;
    font-family: arial, verdana, tahoma, sans-serif, serif;
    background: rgba(0, 0, 0, .75);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    visibility: hidden;
    z-index: 999999999999999999999;
}

body.debugger #fc-messages-error {
    opacity: 1;
    visibility: visible;
}

#fc-messages-error .messages-close {
    cursor: pointer;
    margin: auto;
    color: #EFEFEF;
    font-size: 20px;
    font-variant: small-caps;
    line-height: 30px;
    text-align: center;
    background: rgba(255, 0, 0, .5);
    width: 120px;
    height: 30px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 15%;
    box-shadow: 0 0 5px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(255, 0, 0, .5), inset 0 0 0 2px rgba(0, 0, 0, .5);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(255, 0, 0, .5), inset 0 0 0 2px rgba(0, 0, 0, .5);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(255, 0, 0, .5), inset 0 0 0 2px rgba(0, 0, 0, .5);
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
}

#fc-messages-error .messages-close:hover {
    color: #FEFEFE;
    background: rgba(255, 0, 0, .75);
}

#fc-messages-error .messages-title {
    padding: 10px;
    color: #9C27B0;
    font-size: 150%;
    text-align: center;
    border-bottom: 1px solid #303030;
}

#fc-messages-error .messages-main {
    margin-right: -50%;
    background: rgba(0, 0, 0, .75);
    width: 100%;
    max-width: 800px;
    max-height: 50%;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    position: absolute;
    top: 50%;
    left: 50%;
    box-shadow: 0 0 5px rgba(0, 0, 0, .5), 0 0 0 1px rgba(0, 0, 0, .75), 0 0 0 2px rgba(255, 255, 255, .15);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .5), 0 0 0 1px rgba(0, 0, 0, .75), 0 0 0 2px rgba(255, 255, 255, .15);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .5), 0 0 0 1px rgba(0, 0, 0, .75), 0 0 0 2px rgba(255, 255, 255, .15);
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    overflow: hidden;
    overflow-y: auto;
}

#fc-messages-error .messages-main::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

#fc-messages-error .messages-main::-webkit-scrollbar-thumb {
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

#fc-messages-error .messages-main::-webkit-scrollbar-track {
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

#fc-messages-error pre {
    padding: 1.5em;
    font-family: Consolas, Menlo, Monaco, Courier, "Courier New", monospace, sans-serif, serif;
    white-space: pre-wrap;
    word-wrap: break-word;
    word-break: break-all;
}

.fc-loading {
    opacity: 0;
    margin: auto;
    color: #303030;
    font-size: 12px;
    line-height: 1.428571429;
    background: rgba(0, 0, 0, .9);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    visibility: hidden;
    z-index: 999999999;
}

.fc-loading.active {
    opacity: 1;
    visibility: visible;
}

.fc-loading:before {
    content: "Loading...";
    color: rgba(255, 255, 255, .5);
    font-size: 100%;
    text-align: center;
    line-height: 100px;
    background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0id2hpdGUiPjx0aXRsZT5Gb29kQ29ubmVjdGlvbiAtIERldiB0ZWFtPC90aXRsZT48cGF0aCBvcGFjaXR5PSIuMjUiIGQ9Ik0xNiAwIEExNiAxNiAwIDAgMCAxNiAzMiBBMTYgMTYgMCAwIDAgMTYgMCBNMTYgNCBBMTIgMTIgMCAwIDEgMTYgMjggQTEyIDEyIDAgMCAxIDE2IDQiLz48cGF0aCBkPSJNMTYgMCBBMTYgMTYgMCAwIDEgMzIgMTYgTDI4IDE2IEExMiAxMiAwIDAgMCAxNiA0eiI+PGFuaW1hdGVUcmFuc2Zvcm0gYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIGZyb209IjAgMTYgMTYiIHRvPSIzNjAgMTYgMTYiIGR1cj0iMC44cyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+PC9wYXRoPjwvc3ZnPg==) no-repeat center;
    width: 100px;
    height: 100px;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.fc-loading[data]:before {
    content: attr(data);
}

.fc-loading.no-text:before {
    content: "";
}
#mail .caption{
  position: relative;
  font-size: 15px;
}
#mail .caption:before{
  content:"";
    display: inline-block;
    background: url("../img/takeout/sec7_icon.png") no-repeat center / 100% auto;
    width: 20px;
    height: 12px;
  margin-right: 5px;
  position: relative;
  top: 2px;
}
#mail .input{
 width: 100%; 
} 
@media screen and (min-width: 768px) {
  #mail{
    font-size: 16px;
  }
  #mail .row > .col{
    padding-bottom: 31px;    
    justify-content: flex-start;
  }
  #mail .row.row-mes .col{
    padding-bottom: 10px;
  }
  #mail .caption{
    margin-bottom: 0;
    line-height: 38px;
    width: 420px;    
    font-size: 19px;
    padding-left: 12px;
  }
  #mail .caption:before{
    width: 32px;
    height: 17px;
  }
  #mail .input{
    width: 531px;
  }
  #mail .mark-require{
    font-size: 14px;
    width: 50px;
    height: 26px;
    top: 6px;
  }
  .fc-form .form-submit{
    justify-content: center;
    width: 313px !important;
    line-height: 54px !important;
  }
  
  #mail .fc-form .col.submit-form{
    margin-top: 7px;
    padding-bottom: 0;
  }
  .fc-form .form-submit i{
    width: 98px;
    margin-left: 32px;
  }
  .privacy{
    padding-left: 20px !important;
  }
  #mail .privacy .input{
    width: 100%;
  }
  .submit-confirm{
    padding-bottom: 10px;
  }
  #mail button + button{
    margin-left: 40px;
  }
   #privacy_checkbox{
    justify-content: center;
  }
  .privacy{
    padding: 22px 0 !important;
  }
}
@media screen and (max-width: 767px) {
  input, select, textarea{
    padding: 11px 10px;
  }
  #mail .row > .col {
    padding-bottom: 25px;
  }
  textarea{
    min-height: 98px;
  }
  #mail .submit{
    margin-top: 9px;
    display: block;
  }
  #mail button{
    padding: 0 10px 0 0;
    width: 200px !important;
  }
  #mail button + button{
    margin-top: 15px !important;
  }
  #mail .fc-form .col.submit-form{
    margin-top: 0;
  }
 
}

.i-custom {
    cursor: pointer;
    display: flex;    
    position: relative;
}

.i-custom input {
    opacity: 0;
    position: absolute;
}

.i-custom span {
    padding-left: 27px;
    position: relative;
}

.i-custom span:before,
.i-custom span:after {
    content: "";
    margin: auto;    
    position: absolute;
    top: 6px;    
    transition: all .3s ease;
}

.i-custom input[type="radio"] ~ span:before,
.i-custom input[type="radio"] ~ span:after {
    border-radius: 100%;
}

.i-custom span:before {
    background: #f3f3f3;
    width: 17px;
    height: 17px;
    border: 1px solid #bababa;
    left: 0;
}

.i-custom span:after {
    opacity: 0;
    background: #607D8B;
    width: 15px;
    height: 15px;
    left: 4px;
    transform: scale(0);
  top: 10px;
}

.i-custom:hover span:after {
    opacity: .5;
    transform: scale(1);
}

.i-custom input:checked ~ span:after {
    opacity: 1;
    transform: scale(1);
}
#privacy_checkbox {
    display: flex;    
    align-items: flex-start;
}

#privacy_checkbox .i-custom span {
    display: block;
    text-align: left;
 }
#privacy_checkbox .i-custom:hover span:after {
    opacity: 0;
    transform: scale(1);
}

#privacy_checkbox .i-custom input:checked ~ span:after {
    opacity: 1;
    transform: scale(1);
}

#privacy_checkbox input {
    border: 1px solid #d8d8d8;
    padding: 2px 8px 25px;
    box-sizing: border-box;
    width: auto !important;
    margin-right: 17px;
}

#privacy_checkbox a {
    text-decoration: underline;
}

#privacy_checkbox a:hover {
    text-decoration: none;
}
.popupmail {
    text-align: left;
}
.popupmail h2{
    text-align: center;
    font-size: 6vw;
    margin-bottom: 10vw !important;
}
.popupmail .rule p {
    margin-bottom: 30px;
}
.popupmail .rule dt {
    font-weight: bold;
}
.popupmail .rule dd {
    margin-left: 34px;
    margin-bottom: 17px;
    line-height: 22px;
}
.remodal .remodal-close{
  top: 3vw !important;
  width: 35px !important;
  right: 5% !important;
}
@media only screen and (min-width: 768px) {
  button{
    line-height: 37px !important;
    width: 313px !important;
  }
  .remodal{
    padding: 60px 0 70px;
    font-size: 14px;
  }
  .popupmail h2{
      font-size: 30px;
      margin-bottom: 30px !important;
  }
  .popupmail {
      padding: 90px 100px 90px;
  }
  .popupmail .rule p {
    margin-bottom: 30px;
    font-size: 14px;
  }
  textarea{
    min-height: 209px;
  }
  .i-custom span:before{
    top: 4px;
    width: 21px;
    height: 21px;
  }
  .i-custom span:after{
    width: 11px;
    height: 11px;
    left: 5px;
    top: 9px;
  }
  .submit-confirm{
    margin: auto;
    width: 690px !important;
    justify-content: space-between;
  }
}
.fc-form #privacy_checkbox [class^='error']{
 transform: translateY(100%);
}