:root{
    --font-color: #333;
    --font-secondary: #666;
    --font-gray: #d5d5d5;
    --font-white: #fff;
    --font-btn: #f4c81f;/*#02A0E9*/
    --font-highlight: #E90202;
    --color-primary: #f4c81f;/*#02A0E9*/
    --bg-highlight: #E90202;
    --bg-primary: #fff;
    --bg-secondary: #fafafa;/*#F7F9FA*/
    --bg-gray: #F4F4F4;
    --bg-white:#fff;
    --bg-black: #333;
    --bg-golden: #EBE0CE;
}
.font-color,.font-color > *{color:var(--font-color);}
.font-secondary, .font-secondary *{color:var(--font-secondary);}
.font-gray,.font-gray > *{color:var(--font-gray);}
*{outline:none;padding:0;margin:0;word-wrap: break-word;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}


/* * { padding: 0; margin: 0; box-sizing: border-box; outline:none;word-wrap: break-word;} */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; font-size:14px; }
body { font: 14px/1.5 Microsoft YaHei,Heiti SC,tahoma,arial,Hiragino Sans GB,"\5B8B\4F53",sans-serif; line-height: 1.4; color:var(--font-color);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none; width:100%;height:100%; }
a { text-decoration: none; background-color: transparent; cursor:pointer; color:inherit; }
table { border-collapse: collapse; }
input, button, select, optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit;outline: none; } /*-webkit-appearance: none;-moz-appearance: none;appearance: none;  将会影响checkbox*/
ul { list-style: none; }
img { height: auto; max-width: 100%;vertical-align: middle;image-rendering:-moz-crisp-edges; image-rendering:-o-cripsp-edges; image-rendering:-webkit-optimize-contrast; image-rendering:cripsp-edges; -ms-interpolation-mode:nearest-neighbor;}
table { border-collapse: collapse; border-spacing: 0; }
td, th { padding: 0; }
p,h1,h2,h3,h4,h5,h6{width:100%;}

/* chrome 低版本选中事件 */
/* input:-internal-autofill-previewed,input:-internal-autofill-selected { -webkit-text-fill-color: #FFFFFF !important;transition: background-color 5000s ease-in-out 0s !important;} */
/* firefox */
input {filter: none !important;}

/*image holder*/
.holder1-1:before{
  content: "";
  display: block;
  width: 100%;
  height: 0;
  padding-top:100%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid meet'%3E%3Crect x='0' y='0' width='100' height='100' fill='rgba(192, 192, 192, 0.3)' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}
.holder2-1:before{
    content: "";
    display: block;
    width: 100%;
    height: 0;
    padding-top:50%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 100' preserveAspectRatio='xMidYMid meet'%3E%3Crect x='0' y='0' width='200' height='100' fill='rgba(192, 192, 192, 0.3)' /%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
}
.holder1-2:before{
    content: "";
    display: block;
    width: 100%;
    height: 0;
    padding-top:200%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 200' preserveAspectRatio='xMidYMid meet'%3E%3Crect x='0' y='0' width='100' height='200' fill='rgba(192, 192, 192, 0.3)' /%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
    position:absolute;
}
.holder3-1:before{
    content: "";
    display: block;
    width: 100%;
    height: 0;
    padding-top:33.333%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 100' preserveAspectRatio='xMidYMid meet'%3E%3Crect x='0' y='0' width='300' height='100' fill='rgba(192, 192, 192, 0.3)' /%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
}
.holder1-1,.holder2-1,.holder1-2,.holder3-1{ position: relative; }
.holder1-1 > img,.holder2-1 > img,.holder1-2 > img,.holder3-1 > img,
.holder1-1 > video,.holder2-1 > video,.holder1-2 > video,.holder3-1 > video,
.holder1-1 > canvas,.holder2-1 > canvas,.holder1-2 > canvas.holder3-1 > canvas
{ position: absolute; top: 0; left: 0; bottom: 0; width: 100%; height: 100%;background-color: inherit; }
/* main 主体 */
.mobile{display: none;}
.pc{display: -webkit-flex; display: -ms-flexbox; display: flex; flex-wrap: wrap; flex-basis:auto;}
.d-mobile{display:none}
.d-pc{display: block;}

.main{ width: 100% !important; margin: 0 auto; max-width: 100%; background-color: rgba(255, 255, 255, 0);scrollbar-width:none;scroll-behavior: smooth; }
.iconfont{font-family:"iconfont" !important; font-size:16px;font-style:normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale;}
.default-pd > *{ padding:0.75rem; }
.posr{position: relative;}.posa{position: absolute;top:0;bottom:0; left:0;}.posf{position: fixed;top:0;left:0;bottom:0;height:100%;width:100%;}
.z-1{z-index:1;}.z-2{z-index:2;}.z-3{z-index:3;}.z-4{z-index:4;}.z-5{z-index:5;}.z-9{z-index:9 !important;}.z-10{z-index:10 !important;}
.tn-c,.tn-c > *{text-align:center}
.h-0{height:0;overflow:hidden;}.w-0{width:0;overflow:hidden;}
.ellipsis{text-overflow: -o-ellipsis-lastline; overflow: hidden !important; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; white-space: inherit;word-break: break-all; }
.ellipsis2{text-overflow: -o-ellipsis-lastline; overflow: hidden !important; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; white-space: inherit;}
.ellipsis3{text-overflow: -o-ellipsis-lastline; overflow: hidden !important; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; white-space: inherit; }
.scroll-y{overflow-y: auto;overflow-x: hidden;scrollbar-width:none;scroll-behavior: smooth;}
.d-none { display: none !important; }
.v-none{visibility: hidden;}
.cursor0, .cursor > *{cursor:pointer;}
.cursor-0 > *{cursor:initial;}
/* .no-select,.no-select *{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;} debug:input no select */
.has-select,.has-select div{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;}
.hide-scroll::-webkit-scrollbar {
    width: 0;
    background-color: transparent;
}
.hide-scroll::-webkit-scrollbar-thumb {
    background-color: transparent;
}
.text-del{text-decoration: line-through;}
.text-ul{text-decoration: underline;}

/* 弹性布局 */
.f2x{ display: -webkit-flex; display: -ms-flexbox; display: flex; flex-wrap: wrap;flex-basis:auto; width:100%;position:relative;}
.f2x>*{ box-sizing: border-box; border-spacing: 0; flex-shrink: 0; word-break: break-all; margin: 0; width: 100%; }
.f2x.f-bs,.f2x.f-bs0{ justify-content:space-between; align-items:stretch; }
.f2x.f-bc,.f2x.f-bc0{ justify-content:space-between; align-items:center; }
.f2x.f-be,.f2x.f-be0{ justify-content:space-between; align-items:flex-end; }
.f2x.f-bt,.f2x.f-bt0{justify-content:space-between;align-items:flex-start;}
.f2x.f-s,.f2x.f-s0{justify-content:flex-start; align-items:flex-start; text-align:left;}
.f2x.f-sc,.f2x.f-sc0{ justify-content:flex-start; align-items:center; text-align:left; }
.f2x.f-se,.f2x.f-se0{justify-content:flex-start; align-items:flex-end; text-align:left;}
.f2x.f-ss,.f2x.f-ss0{justify-content:flex-start; align-items:stretch; text-align:left;}
.f2x.f-ec,.f2x.f-ec0{ justify-content: flex-end; align-items:center; text-align:right; }
.f2x.f-cc,.f2x.f-cc0{ justify-content: center; align-items:center; text-align:center; }
.f2x.f-bs>*, .f2x.f-bc>*,.f2x.f-be>*,.f2x.f-bt>*,.f2x.f-s>*,.f2x.f-sc>*,.f2x.f-se>*,.f2x.f-ss>*,.f2x.f-ec>*,.f2x.f-cc>*{width:auto;max-width:100%;}
.f2x.f-bs0>*, .f2x.f-bc0>*,.f2x.f-be0>*,.f2x.f-bt0>*,.f2x.f-s0>*,.f2x.f-sc0>*,.f2x.f-se0>*,.f2x.f-ss0>*,.f2x.f-ec0>*,.f2x.f-cc0 > *{width:100%;}
.f2x.f-as{align-content:flex-start;align-items:flex-start;}
.f2x.f-ae{align-content:flex-end;align-items:flex-start;}
.f2x.f-ab{align-content:space-between;align-items:flex-start;}
.f2x.f-ac{align-content:center;align-items:flex-start;}
.f2x.f-as>*, .f2x.f-ae>*, .f2x.f-ab>*, .f2x.f-ac>*{width:100%;}
.f2x.f-ais{align-items:stretch;}
.f2x.bl>* {align-items: baseline;}
/* .f-aib { align-items: baseline !important; } */

/*flex fixed*/
.f2x.cols1 > *{-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;flex-grow: 1;}
.f2x.cols2 > *{-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;flex-grow: 1;}
.f2x.cols3 > * {-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%;max-width: 33.333333%;flex-grow: 1;}
.f2x.cols4 > * {-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;flex-grow: 1;}
.f2x.cols5 > * {-ms-flex: 0 0 20%;flex: 0 0 20%;max-width: 20%;flex-grow: 1;}
.f2x.cols6 > * {-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;flex-grow: 1;}
.f2x.colx1 > * {width:100%;margin-right:0;}
.f2x.colx2 > * {width: calc(50% - 6px);}
.f2x.colx2 > *:nth-child(odd){margin-right:12px;}
.f2x.colx3 > * {width: calc(33.3333% - 6px);}
.f2x.colx3 > *:not(:nth-child(3n)){margin-right:9px;}
.f2x.colx4 > * {width: calc(25% - 6px);}
.f2x.colx4 > *:not(:nth-child(4n)){margin-right:8px;}
.f2x.colx5 > * {width: calc(20% - 6px);}
.f2x.colx5 > *:not(:nth-child(5n)){margin-right:7.5px;}
.f2x.colx6 > * {width: calc(16.6666% - 6px);}
.f2x.colx6 > *:not(:nth-child(6n)){margin-right:7.2px;}

/*flex*/
.f2x > .fg0 {flex-basis: 0;max-width: 100%;flex-grow: 0;}
.f2x > .fg1 {flex-basis: 0;max-width: 100%;flex-grow: 1;}
.f2x > .fg2 {flex-basis: 0;max-width: 100%;flex-grow: 2;}
.f2x > .fg3 {flex-basis: 0;max-width: 100%;flex-grow: 3;}
.f2x > .fg4 {flex-basis: 0;max-width: 100%;flex-grow: 4;}
.f2x > .fg5 {flex-basis: 0;max-width: 100%;flex-grow: 5;}
.f2x > .fg6 {flex-basis: 0;max-width: 100%;flex-grow: 6;}
.f2x > .fg7 {flex-basis: 0;max-width: 100%;flex-grow: 7;}
.f2x > .fg8 {flex-basis: 0;max-width: 100%;flex-grow: 8;}
.f2x > .fg9 {flex-basis: 0;max-width: 100%;flex-grow: 9;}
.f2x > .mw10,.f2x > .mw16,.f2x > .mw20,.f2x > .mw25,.f2x > .mw30,.f2x > .mw33,.f2x > .mw40,.f2x > .mw50,
.f2x > .mw60,.f2x > .mw70,.f2x > .mw80,.f2x > .mw90,.f2x > .mw100,.f2x > .nw10,.f2x > .nw16,.f2x > .nw20,
.f2x > .nw25,.f2x > .nw30,.f2x > .nw33,.f2x > .nw40,.f2x > .nw50,.f2x > .nw60,.f2x > .nw70,.f2x > .nw80,
.f2x > .nw90,.f2x > .w10,.f2x > .w16,.f2x > .w20,.f2x > .w25,.f2x > .w30,.f2x > .w33,.f2x > .w40,
.f2x > .w50,.f2x > .w60,.f2x > .w70,.f2x > .w80,.f2x > .w90,.f2x > .w100{width:auto;flex-basis:auto;flex-grow: 0;}
.f2x > .mw10{max-width:10%;}
.f2x > .mw16{max-width:16.6666%;}
.f2x > .mw20{max-width:20%;}
.f2x > .mw25{max-width:25%;}
.f2x > .mw30{max-width:30%;}
.f2x > .mw33{max-width:33.333333%;}
.f2x > .mw40{max-width:40%;}
.f2x > .mw50{max-width:50%;}
.f2x > .mw60{max-width:60%;}
.f2x > .mw70{max-width:70%;}
.f2x > .mw80{max-width:80%;}
.f2x > .mw90{max-width:90%;}
.f2x > .mw100{max-width:100%;}
.f2x > .nw10{min-width:10%;}
.f2x > .nw16{min-width:16.6666%;}
.f2x > .nw20{min-width:20%;}
.f2x > .nw25{min-width:25%;}
.f2x > .nw30{min-width:30%;}
.f2x > .nw33{min-width:33.333333%;}
.f2x > .nw40{min-width:40%;}
.f2x > .nw50{min-width:50%;}
.f2x > .nw60{min-width:60%;}
.f2x > .nw70{min-width:70%;}
.f2x > .nw80{min-width:80%;}
.f2x > .nw90{min-width:90%;}
.f2x > .w10{width:10%;flex-basis:10%;}
.f2x > .w16{width:16.6666%;flex-basis:16.6666%;} /* 1/6 */
.f2x > .w20{width:20%;flex-basis:20%;}
.f2x > .w25{width:25%;flex-basis:25%;} /* 1/4 */
.f2x > .w30{width:30%;flex-basis:30%}
.f2x > .w33{width:33.333333%;flex-basis:33.333333%;} /* 1/3 */
.f2x > .w40{width:40%;flex-basis:40%;}
.f2x > .w50{width:50%;flex-basis:50%;}
.f2x > .w60{width:60%;flex-basis:60%;}
.f2x > .w70{width:70%;flex-basis:70%;}
.f2x > .w75{width:75%;flex-basis:75%;}
.f2x > .w80{width:80%;flex-basis:80%;}
.f2x > .w90{width:90%;flex-basis:90%;}
.f2x > .w100{width:100%;flex-basis:100%;}
.f2x > .w0{width:auto;}

/* form */
.input-group{display:block;position:relative;width:100%;height:auto;}

.input-group input,.input-group textarea,.input-group select,
.f2m input,.f2m textarea,.f2m select{
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--font-secondary);
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid var(--bg-gray);
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.input-group textarea, .f2m textarea { overflow: auto; resize: vertical; height: 6rem; line-height:1.5rem; }
.input-group input::-ms-expand,.input-group textarea::-ms-expand,.input-group select::-ms-expand,
.f2m input::-ms-expand,.f2m textarea::-ms-expand,.f2m select::-ms-expand
{ background-color: transparent; border: 0; }
.input-group input:focus,.input-group textarea:focus,.input-group select:focus,
.f2m input:focus,.f2m textarea:focus,.f2m select:focus{
    color: #495057;
    background-color: #fff;
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.nofocus .input-group input:focus,.nofocus .input-group textarea:focus,.nofocus .input-group select:focus{
    color: initial;
    background-color: initial;
    border-color: var(--bg-secondary);
    outline: initial;
    box-shadow: initial;
}

.input-group .input-tips{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    flex-basis: auto;
    width: 100%;
    position: relative;
    justify-content: space-between;
    align-items: center;
    padding:0;
    color:var(--font-secondary);
    text-align:left;
}
.input-group .input-tips > * {
    box-sizing: border-box;
    border-spacing: 0;
    flex-shrink: 0;
    word-break: break-all;
    overflow: auto;
    margin: 0;
}
.input-group .input-error{ color:var(--font-highlight); width:100%;margin-top:0.5rem; }
.input-group .input-num{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: nowrap;
    position: relative;
    justify-content:flex-start; align-items:center; text-align:left;
    margin-top: 0.5rem; 
    margin-bottom:0.5rem;
    color: var(--font-gray);
}
.input-group .input-num-value{margin-left:0.4rem;}
/* 去除默认的搜索图标 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration,
input[type="password"]::-webkit-search-cancel-button,
input[type="password"]::-webkit-search-decoration,
input[type="password"]::-webkit-search-results-button,
input[type="password"]::-webkit-search-results-decoration
{
  -webkit-appearance: none;
}
/*number的上下箭头*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
}
input[type='number'] {
  -moz-appearance: textfield;
}

.border0{
    border:none !important;
}
.border0:focus{
    box-shadow:none !important;
}
.f2m input::-webkit-input-placeholder,.f2m textarea::-webkit-input-placeholder,.f2m select::-webkit-input-placeholder,
.input-group input::-webkit-input-placeholder,.input-group textarea::-webkit-input-placeholder,.input-group select::-webkit-input-placeholder{
    color: #6c757d;
    opacity: 1;
}
.f2m input::-moz-placeholder,.f2m textarea::-moz-placeholder,.f2m select::-moz-placeholder,
.input-group input::-moz-placeholder,.input-group textarea::-moz-placeholder,.input-group select::-moz-placeholder{
    color: #6c757d;
    opacity: 1;
}
.f2m input:-ms-input-placeholder,.f2m textarea:-ms-input-placeholder,.f2m select:-ms-input-placeholder,
.input-group input:-ms-input-placeholder,.input-group textarea:-ms-input-placeholder,.input-group select:-ms-input-placeholder
{
    color: #6c757d;
    opacity: 1;
} 
.f2m input::-ms-input-placeholder,.f2m textarea::-ms-input-placeholder,.f2m select::-ms-input-placeholder,
.input-group input::-ms-input-placeholder,.input-group textarea::-ms-input-placeholder,.input-group select::-ms-input-placeholder{
    color: #6c757d;
    opacity: 1;
} 
.f2m input::placeholder,.f2m textarea::placeholder,.f2m select::placeholder,
.input-group input::placeholder,.input-group textarea::placeholder,.input-group select::placeholder{
    color: #6c757d;
    opacity: 1;
} 
.f2m input:disabled,.f2m textarea:disabled,.f2m select:disabled,
.f2m input[readonly],.f2m textarea[readonly],.f2m select[readonly],
.input-group input:disabled,.input-group textarea:disabled,.input-group select:disabled,
.input-group input[readonly],.input-group textarea[readonly],.input-group select[readonly]
{
    background-color: #e9ecef;
    opacity: 1;
} 
.f2m input[type="date"],
.f2m input[type="time"],
.f2m input[type="datetime-local"],
.f2m input[type="month"],
.input-group input[type="date"],
.input-group input[type="time"],
.input-group input[type="datetime-local"],
.input-group input[type="month"]
{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; 
}
.f2m select:-moz-focusring,.input-group select:-moz-focusring{
    color: transparent;
    text-shadow: 0 0 0 #495057;
}
.f2m select:focus::-ms-value,.input-group select:focus::-ms-value{
    color: #495057;
    background-color: #fff;
}
/*input clear*/
input[type="search"]::-webkit-search-cancel-button {-webkit-appearance: none;}
.f2m .input-clear,.input-group .input-clear{ position: absolute; top: 0; right: 0; transform: translateY(0); width: 2rem; height: calc(1.5em + 0.75rem); border: none; background: transparent; cursor: pointer; z-index:1; }
.f2m .input-clear:before,
.f2m .input-clear:after,
.input-group .input-clear:before,
.input-group .input-clear:after{ content: ''; position: absolute; top: 50%; left: 50%; width: 2px; height: 14px; background-color: var(--font-gray); transform: translate(-50%, -50%) rotate(45deg);z-index:1; }
.f2m .input-clear:after,.input-group .input-clear:after{ transform: translate(-50%, -50%) rotate(-45deg); }

.form-checkbox .checked,.form-checkbox .nochecked,.form-radio .checked,.form-radio .nochecked{display:block;font-size:1.1rem;}
.form-checkbox.active .checked,.form-radio.active .checked{display:block;}
.form-checkbox.active .nochecked,.form-radio.active .nochecked{display:none;}
.form-checkbox .checked,.form-radio .checked{display:none;}
.form-checkbox .form-checkbox-name,.form-radio .form-radio-name{margin-left:0.3rem;}
.form-radio{margin-right:0.5rem;}
.form-radio .iconfont{font-size:1.5rem;}

/* mobile [if (min-width:415px) and (max-width:767px), it's going to be centered ] */
@media only screen and (max-width:767px) {
    .mobile{display: -webkit-flex; display: -ms-flexbox; display: flex; flex-wrap: wrap; flex-basis:auto;}
    .pc{display: none;}
    .d-mobile{display:block;}
    .d-pc{display:none;}
    html,body{ font-size:14px; }
    .iconfont{font-size:14px;}
    .p5g > *{ padding:0.5rem; }
    .f2x.cols1-sm > div{-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;flex-grow: 1;}
    .f2x.cols2-sm > div{-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;flex-grow: 1;}
    .f2x.cols3-sm > div{-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%;max-width: 33.333333%;flex-grow: 1;}
    .f2x.cols4-sm > div{-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;flex-grow: 1;}
    .f2x.cols5-sm > div{-ms-flex: 0 0 20%;flex: 0 0 20%;max-width: 20%;flex-grow: 1;}
    .f2x.cols6-sm > div{-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;flex-grow: 1;}
    .f2x.colx1-sm > div{width:100%;margin-right:0;}
    .f2x.colx2-sm > div{width: calc(50% - 6px);}
    .f2x.colx2-sm > div:nth-child(odd){margin-right:12px;}
    .f2x.colx2-sm > div:not(:nth-child(odd)){margin-right:0;}
    .f2x.colx3-sm > div{width: calc(33.3333% - 6px);}
    .f2x.colx3-sm > div:not(:nth-child(3n)){margin-right:9px;}
    .f2x.colx3-sm > div:nth-child(3n){margin-right:0;}
    .f2x.colx4-sm > div{width: calc(25% - 6px);}
    .f2x.colx4-sm > div:not(:nth-child(4n)){margin-right:8px;}
    .f2x.colx4-sm > div:nth-child(4n){margin-right:0;}
    .f2x.colx5-sm > div{width: calc(20% - 6px);}
    .f2x.colx5-sm > div:not(:nth-child(5n)){margin-right:7.5px;}
    .f2x.colx5-sm > div:nth-child(5n){margin-right:0;}
    .f2x.colx6-sm > div{width: calc(16.6666% - 6px);}
    .f2x.colx6-sm > div:not(:nth-child(6n)){margin-right:7.2px;}
    .f2x.colx6-sm > div:nth-child(6n){margin-right:0;}
    .f2x > .fg0-sm {flex-basis: 0;max-width: 100%;flex-grow: 0;}
    .f2x > .fg1-sm {flex-basis: 0;max-width: 100%;flex-grow: 1;}
    .f2x > .fg2-sm {flex-basis: 0;max-width: 100%;flex-grow: 2;}
    .f2x > .fg3-sm {flex-basis: 0;max-width: 100%;flex-grow: 3;}
    .f2x > .fg4-sm {flex-basis: 0;max-width: 100%;flex-grow: 4;}
    .f2x > .fg5-sm {flex-basis: 0;max-width: 100%;flex-grow: 5;}
    .f2x > .fg6-sm {flex-basis: 0;max-width: 100%;flex-grow: 6;}
    .f2x > .fg7-sm {flex-basis: 0;max-width: 100%;flex-grow: 7;}
    .f2x > .fg8-sm {flex-basis: 0;max-width: 100%;flex-grow: 8;}
    .f2x > .fg9-sm {flex-basis: 0;max-width: 100%;flex-grow: 9;}
    .f2x > .mw10-sm,.f2x > .mw16-sm,.f2x > .mw20-sm,.f2x > .mw25-sm,.f2x > .mw30-sm,.f2x > .mw33-sm,.f2x > .mw40-sm,.f2x > .mw50-sm,
    .f2x > .mw60-sm,.f2x > .mw70-sm,.f2x > .mw80-sm,.f2x > .mw90-sm,.f2x > .mw100-sm,.f2x > .nw10-sm,.f2x > .nw16-sm,.f2x > .nw20-sm,
    .f2x > .nw25-sm,.f2x > .nw30-sm,.f2x > .nw33-sm,.f2x > .nw40-sm,.f2x > .nw50-sm,.f2x > .nw60-sm,.f2x > .nw70-sm,.f2x > .nw80-sm,
    .f2x > .nw90-sm,.f2x > .w10-sm,.f2x > .w16-sm,.f2x > .w20-sm,.f2x > .w25-sm,.f2x > .w30-sm,.f2x > .w33-sm,.f2x > .w40-sm,
    .f2x > .w50-sm,.f2x > .w60-sm,.f2x > .w70-sm,.f2x > .w80-sm,.f2x > .w90-sm,.f2x > .w100-sm{width:auto;flex-basis:auto;flex-grow: 0;}
    .f2x > .mw10-sm{max-width:10%;}
    .f2x > .mw16-sm{max-width:16.6666%;}
    .f2x > .mw20-sm{max-width:20%;}
    .f2x > .mw25-sm{max-width:25%;}
    .f2x > .mw30-sm{max-width:30%;}
    .f2x > .mw33-sm{max-width:33.333333%;}
    .f2x > .mw40-sm{max-width:40%;}
    .f2x > .mw50-sm{max-width:50%;}
    .f2x > .mw60-sm{max-width:60%;}
    .f2x > .mw70-sm{max-width:70%;}
    .f2x > .mw80-sm{max-width:80%;}
    .f2x > .mw90-sm{max-width:90%;}
    .f2x > .mw100-sm{max-width:100%;}
    .f2x > .nw10-sm{min-width:10%;}
    .f2x > .nw16-sm{min-width:16.6666%;}
    .f2x > .nw20-sm{min-width:20%;}
    .f2x > .nw25-sm{min-width:25%;}
    .f2x > .nw30-sm{min-width:30%;}
    .f2x > .nw33-sm{min-width:33.333333%;}
    .f2x > .nw40-sm{min-width:40%;}
    .f2x > .nw50-sm{min-width:50%;}
    .f2x > .nw60-sm{min-width:60%;}
    .f2x > .nw70-sm{min-width:70%;}
    .f2x > .nw80-sm{min-width:80%;}
    .f2x > .nw90-sm{min-width:90%;}
    .f2x > .w10-sm{width:10%;flex-basis:10%;}
    .f2x > .w16-sm{width:16.6666%;flex-basis:16.6666%;} /* 1/6 */
    .f2x > .w20-sm{width:20%;flex-basis:20%;}
    .f2x > .w25-sm{width:25%;flex-basis:25%;} /* 1/4 */
    .f2x > .w30-sm{width:30%;flex-basis:30%}
    .f2x > .w33-sm{width:33.333333%;flex-basis:33.333333%;} /* 1/3 */
    .f2x > .w40-sm{width:40%;flex-basis:40%;}
    .f2x > .w50-sm{width:50%;flex-basis:50%;}
    .f2x > .w60-sm{width:60%;flex-basis:60%;}
    .f2x > .w70-sm{width:70%;flex-basis:70%;}
    .f2x > .w80-sm{width:80%;flex-basis:80%;}
    .f2x > .w90-sm{width:90%;flex-basis:90%;}
    .f2x > .w100-sm{width:100%;flex-basis:100%;}
    .f2x > .w0-sm{width:auto;}
}

/* ipad (mini 768px) */
@media only screen and (min-width: 768px) and (max-width: 1199px) {
    .f2x.cols1-md > div{-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;flex-grow: 1;}
    .f2x.cols2-md > div{-ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;flex-grow: 1;}
    .f2x.cols3-md > div{-ms-flex: 0 0 33.333333%;flex: 0 0 33.333333%;max-width: 33.333333%;flex-grow: 1;}
    .f2x.cols4-md > div{-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;flex-grow: 1;}
    .f2x.cols5-md > div{-ms-flex: 0 0 20%;flex: 0 0 20%;max-width: 20%;flex-grow: 1;}
    .f2x.cols6-md > div{-ms-flex: 0 0 16.666667%;flex: 0 0 16.666667%;max-width: 16.666667%;flex-grow: 1;}
    .f2x.colx1-md > div{width:100%;margin-right:0;}
    .f2x.colx2-md > div{width: calc(50% - 6px);}
    .f2x.colx2-md > div:nth-child(odd){margin-right:12px;}
    .f2x.colx2-md > div:not(div:nth-child(odd)){margin-right:0;}
    .f2x.colx3-md > div{width: calc(33.3333% - 6px);}
    .f2x.colx3-md > div:not(div:nth-child(3n)){margin-right:9px;}
    .f2x.colx3-md > div:nth-child(3n){margin-right:0;}
    .f2x.colx4-md > div{width: calc(25% - 6px);}
    .f2x.colx4-md > div:not(div:nth-child(4n)){margin-right:8px;}
    .f2x.colx4-md > div:nth-child(4n){margin-right:0;}
    .f2x.colx5-md > div{width: calc(20% - 6px);}
    .f2x.colx5-md > div:not(div:nth-child(5n)){margin-right:7.5px;}
    .f2x.colx5-md > div:nth-child(5n){margin-right:0;}
    .f2x.colx6-md > div{width: calc(16.6666% - 6px);}
    .f2x.colx6-md > div:not(div:nth-child(6n)){margin-right:7.2px;}
    .f2x.colx6-md > div:nth-child(6n){margin-right:0;}
    .f2x > .fg0-md {flex-basis: 0;max-width: 100%;flex-grow: 0;}
    .f2x > .fg1-md {flex-basis: 0;max-width: 100%;flex-grow: 1;}
    .f2x > .fg2-md {flex-basis: 0;max-width: 100%;flex-grow: 2;}
    .f2x > .fg3-md {flex-basis: 0;max-width: 100%;flex-grow: 3;}
    .f2x > .fg4-md {flex-basis: 0;max-width: 100%;flex-grow: 4;}
    .f2x > .fg5-md {flex-basis: 0;max-width: 100%;flex-grow: 5;}
    .f2x > .fg6-md {flex-basis: 0;max-width: 100%;flex-grow: 6;}
    .f2x > .fg7-md {flex-basis: 0;max-width: 100%;flex-grow: 7;}
    .f2x > .fg8-md {flex-basis: 0;max-width: 100%;flex-grow: 8;}
    .f2x > .fg9-md {flex-basis: 0;max-width: 100%;flex-grow: 9;}
    .f2x > .mw10-md,.f2x > .mw16-md,.f2x > .mw20-md,.f2x > .mw25-md,.f2x > .mw30-md,.f2x > .mw33-md,.f2x > .mw40-md,.f2x > .mw50-md,
    .f2x > .mw60-md,.f2x > .mw70-md,.f2x > .mw80-md,.f2x > .mw90-md,.f2x > .mw100-md,.f2x > .nw10-md,.f2x > .nw16-md,.f2x > .nw20-md,
    .f2x > .nw25-md,.f2x > .nw30-md,.f2x > .nw33-md,.f2x > .nw40-md,.f2x > .nw50-md,.f2x > .nw60-md,.f2x > .nw70-md,.f2x > .nw80-md,
    .f2x > .nw90-md,.f2x > .w10-md,.f2x > .w16-md,.f2x > .w20-md,.f2x > .w25-md,.f2x > .w30-md,.f2x > .w33-md,.f2x > .w40-md,
    .f2x > .w50-md,.f2x > .w60-md,.f2x > .w70-md,.f2x > .w80-md,.f2x > .w90-md,.f2x > .w100-md{width:auto;flex-basis:auto;flex-grow: 0;}
    .f2x > .mw10-md{max-width:10%;}
    .f2x > .mw16-md{max-width:16.6666%;}
    .f2x > .mw20-md{max-width:20%;}
    .f2x > .mw25-md{max-width:25%;}
    .f2x > .mw30-md{max-width:30%;}
    .f2x > .mw33-md{max-width:33.333333%;}
    .f2x > .mw40-md{max-width:40%;}
    .f2x > .mw50-md{max-width:50%;}
    .f2x > .mw60-md{max-width:60%;}
    .f2x > .mw70-md{max-width:70%;}
    .f2x > .mw80-md{max-width:80%;}
    .f2x > .mw90-md{max-width:90%;}
    .f2x > .mw100-md{max-width:100%;}
    .f2x > .nw10-md{min-width:10%;}
    .f2x > .nw16-md{min-width:16.6666%;}
    .f2x > .nw20-md{min-width:20%;}
    .f2x > .nw25-md{min-width:25%;}
    .f2x > .nw30-md{min-width:30%;}
    .f2x > .nw33-md{min-width:33.333333%;}
    .f2x > .nw40-md{min-width:40%;}
    .f2x > .nw50-md{min-width:50%;}
    .f2x > .nw60-md{min-width:60%;}
    .f2x > .nw70-md{min-width:70%;}
    .f2x > .nw80-md{min-width:80%;}
    .f2x > .nw90-md{min-width:90%;}
    .f2x > .w10-md{width:10%;flex-basis:10%;}
    .f2x > .w16-md{width:16.6666%;flex-basis:16.6666%;} /* 1/6 */
    .f2x > .w20-md{width:20%;flex-basis:20%;}
    .f2x > .w25-md{width:25%;flex-basis:25%;} /* 1/4 */
    .f2x > .w30-md{width:30%;flex-basis:30%}
    .f2x > .w33-md{width:33.333333%;flex-basis:33.333333%;} /* 1/3 */
    .f2x > .w40-md{width:40%;flex-basis:40%;}
    .f2x > .w50-md{width:50%;flex-basis:50%;}
    .f2x > .w60-md{width:60%;flex-basis:60%;}
    .f2x > .w70-md{width:70%;flex-basis:70%;}
    .f2x > .w80-md{width:80%;flex-basis:80%;}
    .f2x > .w90-md{width:90%;flex-basis:90%;}
    .f2x > .w100-md{width:100%;flex-basis:100%;}
    .f2x > .w0-md{width:auto;}
}
.f-nowrap{flex-wrap: nowrap;overflow: hidden;}

/* mobile mini */
@media screen and (max-width: 320px) {
    .main{
        width: 94vw !important;
    }
}
/* mobile md */
@media screen and (min-width: 321px) and (max-width: 375px) {
    .main{
        width: 94vw !important;
    }
}
/* mobile lg */
@media screen and (min-width: 376px) and (max-width: 414px) {
    .main{
        width: 94vw !important;
    }
}
@media screen and (min-width: 415px) and (max-width: 575px) {
    .main{
        width: 94vw !important;
    }
}

@media (min-width: 576px) {
    .main{
        width: 94vw !important;
    }
}
@media (min-width: 768px) {
    .main {
        width: 710px !important;
    }
}
@media (min-width: 992px) {
    .main {
        width: 850px !important;
    }
}
/* pc */

@media (min-width: 1200px) {
    .main {
        width: 990px !important;
    }
}

@media (min-width: 1350px) {
    .main {
        width: 1140px !important;
    }
}