/* A A A : A : A : A : */ body.grabbing { cursor : grabbing !important;} #otium_write { width : 100%; height : auto; display : flex; flex-direction : column; align-items : center; justify-content : center; font-size : min(1.4vw,18px); font-family : "Noto Sans Kr"; margin : 4em 0 6em;} #otium_write form { width : 95%; height : auto; display : flex; flex-direction : column; align-items : center; justify-content : center; max-width : 1000px;} #otium_write .topTextWrap { width : 100%; height : auto; display : flex; flex-direction : column; align-items : center; justify-content : center; margin-bottom : 3em;} #otium_write .topTextWrap .tit { font-weight : 700; line-height : 1em; font-size : 1.5em;} #otium_write .topTextWrap .text { font-size : 1em; color : #999; line-height : 1em; margin : 0 0 1em;} #otium_write .topTextWrap a { font-size : 1em; line-height : 1em; padding : 0.5em 1em; border-radius : 12px; background : #1d2088; color : #fff; transition : .2s;} #otium_write form .formTit { font-weight : 800; margin-bottom : 1.2em; width : 100%; border-bottom : 3px solid #333; padding-bottom : 0.5em; line-height : 1em; color : #333;} #otium_write form .innerWrap { width : 97%; height : auto; display : flex; flex-direction : column; align-items : flex-start; justify-content : center; margin-bottom : 2em;} #otium_write form .innerWrap.nomargin { margin-bottom : 0;} #otium_write form .innerWrap .inputWrap { width : 100%; height : auto; display : flex; flex-direction : column; align-items : flex-start; justify-content : center; margin-bottom : 1.2em;} #otium_write form .innerWrap .inputWrap .inputTit { font-size : 0.9em; font-weight : 700; color : #333; margin-bottom : 0.2em; display : flex; align-items : baseline;} #otium_write form .innerWrap .inputWrap .inputTit span { font-size : 0.8em; color : #9a9a9a; margin-left : 0.3em; display : flex; align-items : center; line-height : 1em;} #otium_write form .innerWrap .inputWrap .inputTit span.warning { color : red; opacity : 0;} #otium_write form .innerWrap .inputWrap .normal_input, #otium_write form .innerWrap .inputWrap select { width : 100%; height : 2em; font-size : 0.9em; border : 1px solid #f1f4f8; background : #f1f4f8; border-radius : 7px; line-height : 1em; padding : 0 0.5em; color : #555;} #otium_write form .innerWrap .inputWrap select { width : 50%;} #otium_write form .innerWrap .inputWrap textarea { width : 100%; height : auto; outline : none; font-size : 14px; font-family : "nanum_suare"; color : #666; min-height : 10em;} #otium_write form .innerWrap .inputWrap textarea:focus { border : 1px solid #9b9bff; box-shadow : 0px 0px 3px 0px #9b9bff;} /* 개인정보 수집현황 */ .Personal_Info { width : 100%; margin : 0 auto; text-align : left; height : auto; padding : 20px 0px 20px 0px; padding-top : 0; margin-bottom : 1.5em; } .inputbackgroundstyle { font-family: "Noto Sans Kr"; font-size:14px; } textarea.inputbackgroundstyle:focus { outline : none; } .Personal_Info .textarea { width : 100%; height : 300px; overflow-y : scroll; overflow-x : hidden; font-size : 13px; padding : 20px 0px 20px 0px; text-align : left; /* TextArea Design */ color: #333333; text-shadow: 0 0px 0px rgba(255, 255, 255, 0.75); background-color: #F6F6F6; *background-color: #fff; background-repeat: repeat-x; background-image: -moz-linear-gradient(top, #ffffff, #f6f6f6); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f6f6f6)); background-image: -webkit-linear-gradient(top, #ffffff, #f6f6f6); background-image: -o-linear-gradient(top, #ffffff, #f6f6f6); background-image: linear-gradient(to bottom, #ffffff, #f6f6f6); border: 1px solid #bbbbbb; border-color: #e6e6e6 #e6e6e6 #bfbfbf; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0); filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); *zoom: 1; -webkit-box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); } .inputbackgroundstyle { /* TextArea Design */ color: #333333; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); background-color: #F6F6F6; *background-color: #fff; background-repeat: repeat-x; background-image: -moz-linear-gradient(top, #ffffff, #f6f6f6); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f6f6f6)); background-image: -webkit-linear-gradient(top, #ffffff, #f6f6f6); background-image: -o-linear-gradient(top, #ffffff, #f6f6f6); background-image: linear-gradient(to bottom, #ffffff, #f6f6f6); border: 1px solid #bbbbbb; border-color: #e6e6e6 #e6e6e6 #bfbfbf; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0); filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); *zoom: 1; -webkit-box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: inset 0 3px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); padding-left : 13px; } .input_textarea { width : 55%; } .textarea p { text-align : left !important; line-height : 24px; word-break:keep-all; } .textarea_thick { margin-left : 60px; font-size : 14px; font-weight : 400; margin-top:0px !important; padding-right:60px; color : #333; } .textarea_nomal { margin-left : 80px; font-size : 12px; font-weight : 300; margin-top:0px !important; padding-right:60px; } .line_1px { width : 95%; height : 1px; border-top : 1px dotted #D5D5D5; margin : 15px auto; } .Personal_CheckBox { width : 100%; height : auto; position : relative; text-align : center; cursor : point; margin : 0 auto; margin-top : -75px; padding-top : 30px; border-radius : 10px; } .checkBox_Design { position : relative; margin-top : 5px; text-align : center; cursor : pointer; overflow : hidden; display : flex; justify-content : center; align-items : center; } .checkBox_Design .input_Form { position : absolute; top : 0; left : 4px; opacity : 0; cursor : pointer; z-index : 5; transform : scale(1.4); -o-transform : scale(1.4); -ms-transform : scale(1.4); -moz-transform : scale(1.4); -webkit-transform : scale(1.4); } .checkBox_Design i { float : left; display : block; width : 20px; height : 20px; background:url(../../../../../Image/checkbox_blue.png) no-repeat left top; z-index : 3; } .checkBox_Design label { float : left; margin-left : 0px; cursor : pointer; font-size : 14px; font-weight : 400; line-height : 1em; transition: all 0.25s cubic-bezier(0.65, 0, 0.21, 1.47) 0s; -o-transition : all ease-in-out .5s; -ms-transition : all ease-in-out .5s; -moz-transition : all ease-in-out .5s; -webkit-transition : all ease-in-out .5s; } .checkBox_Design .input_Form:checked+i { background-position : left bottom; } .checkBox_Design .input_Form:checked+i+label { color : #54C2F1; transition : all ease-in-out .5s; -o-transition : all ease-in-out .5s; -ms-transition : all ease-in-out .5s; -moz-transition : all ease-in-out .5s; -webkit-transition : all ease-in-out .5s; } .btn_red { width : 80px; background : #4374D9; height : 40px; font-size:16px; font-weight:500; color:#fff; border : 0; -webkit-box-shadow: inset 3px 3px 2px rgba(255, 255, 255, 0.3), 1px 1px 2px rgba(0, 0, 0, 0.55); -moz-box-shadow: inset 3px 3px 2px rgba(255, 255, 255, 0.3), 1px 1px 2px rgba(0, 0, 0, 0.55); box-shadow: inset 3px 3px 2px rgba(255, 255, 255, 0.3), 1px 1px 2px rgba(0, 0, 0, 0.55); } #otium_write form .submitBtnWrap { width : 100%; height : auto; display : flex; align-items : center; justify-content : center; } #otium_write form .submitBtnWrap .btn { font-size : 0.9em; line-height : 1em; padding : 0.5em 1em; border-radius : 7px; cursor : pointer; font-family : "nanum_square"; transition : .2s; color : #fff;} #otium_write form .submitBtnWrap .btn.list { background : #7e7e7e; margin-left : 1em; } #otium_write form .submitBtnWrap .btn.list:hover { background : #999; transition : .2s;} #otium_write form .submitBtnWrap .btn.list:active { background : #666;} #otium_write form .submitBtnWrap .btn.submit { background : #060576; } #otium_write form .submitBtnWrap .btn.submit:hover { background : #1f6dca; transition : .2s;} #otium_write form .submitBtnWrap .btn.submit:active { background : #062953;} @media(max-width : 1024px){ /* A A A : A : A : A : */ #otium_write { font-size : min(2.3vw,16px);} } @media(max-width : 640px){ /* A A A : A : A : A : */ #otium_write { font-size : max(12.5px, 3vw); margin : 2.5em 0 4em;} .Personal_Info .textarea { height : 150px; } .textarea_thick { margin-left : 20px; padding-right : 20px; font-size : 11px;} .textarea_nomal { margin-left : 30px; padding-right : 30px; font-size : 10px;} .checkBox_Design label { font-size : 12px;} #otium_write form .submitBtnWrap .btn { font-size : 1.1em;} }