﻿@charset "utf-8";



/* =======================================================
	service step01
========================================================*/
.fm--service01 {}
.fm--service01 .fm--agreement-container {}


/* 전체동의 */
.fm--service01 .fm--agreement-allcheck {padding-bottom: 8px; border-bottom: 1px solid #eee; }
.fm--service01 .fm--agreement-allcheck .fm--label-text {font-size: 15px; color: #222; }

.fm--service01 .fm--agreement-container .fm--label-text .fm--font-main {font-size: 0.8em; margin-left: 4px; margin-right: 0; }




/* =======================================================
	service design 디자인 설정
========================================================*/
.fm--setting-design section {padding: 32px 20px; }
.fm--setting-design section + section {border-top: 2px solid #eee;}

.fm--setting-design .fm--title-wrapper {margin-bottom: 24px; }


/* section01 사이트 유형 설정 */

.fm--setting-design .fm--type-list {}
.fm--setting-design .fm--type-list:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.fm--setting-design .fm--type-item {float: left; width: 48%; margin-top: 16px; margin-left: 3%; }

.fm--setting-design .fm--type-item:first-child,
.fm--setting-design .fm--type-item:nth-child(2n+1) {margin-left: 0; }

.fm--setting-design .fm--type-item:nth-child(1),
.fm--setting-design .fm--type-item:nth-child(2) {margin-top: 0; }

.fm--setting-design .fm--type-item .fm--type-thumb {position: relative; display: block; width: 100%; height: 282px; overflow: hidden; background-repeat: no-repeat; background-position: center top; background-size: 100% auto; border: 1px solid #d7d7d7; border-radius: 5px; box-sizing: border-box; }
.fm--setting-design .fm--type-item .fm--type-thumb img {width: 100%; border-radius: 5px; vertical-align: middle; }
.fm--setting-design .fm--type-item.active .fm--type-thumb {border-color: #6c30e0; }

.fm--setting-design .fm--type-item .fm--radio-group {margin-top: 8px; }
.fm--setting-design .fm--type-item .fm--radio-group .fm--label-text {color: #4f4f4f; }

.fm--setting-design .fm--type-view {position: absolute; bottom: 10px; right: 10px; width: 32px; height: 32px; }
.fm--setting-design .fm--type-view .fm--btn-preview {width: 32px; height: 32px; padding: 0; background-color: rgba(34, 34, 34, 0.4); background-image: url(/images/fieldmake/mobile/sub/btn_site_more.png); background-repeat: no-repeat; background-size: 14px 14px; background-position: center center; border-radius: 999px; line-height: 28px; }



/* section02 사이트 색상 설정 */
.fm--setting-design .fm--form-colorstyle .fm--radio-group {float: left; width: 49%; }
.fm--setting-design .fm--form-colorstyle .iradio {margin-top: 11px; }
.fm--setting-design .fm--form-colorstyle .fm--radio-group + .fm--radio-group {margin-left: 2%;}
.fm--setting-design .fm--form-colorstyle .fm--label-text {line-height: 40px;}
.fm--setting-design .fm--form-colorstyle .fm--selectbox,
.fm--setting-design .fm--form-colorstyle .fm--input-color-group {position: relative; float: left; width: 100%; }

.fm--setting-design .fm--input-color-group .fm--input-text {width: 100%; padding-left: 22px; }
.fm--setting-design .fm--input-color-group .sign-number {position: absolute; top: 13px; left: 9px; }





/* =======================================================
	service site 사이트 설정
========================================================*/
.fm--setting-site {}
.fm--setting-site section {padding: 32px 20px; }
.fm--setting-site section + section {border-top: 2px solid #eee;}

.fm--setting-site .fm--title-wrapper {margin-bottom: 24px; }



/* section01 도메인 설정
-------------------------------------------*/

.fm--setting-site .section01 .fm--list-circle02 {}
.fm--setting-site .section01 .fm--list-circle02 li {margin-top: 8px; font-size: 14px; color: #222;}
.fm--setting-site .section01 .fm--list-circle02 li:first-child {margin-top: 0; }

.fm--setting-site .section01 .fm--list-circle02 strong.fm--font-main {font-weight: 500; }
.fm--setting-site .section01 .fm--list-depth li {margin-top: 4px; font-size: 12px; color: #6f6f6f; }

.fm--setting-site .section01 .fm--box-gray {margin-top: 24px; padding: 16px 16px; }
.fm--setting-site .section01 .fm--radio-group {display: inline-block; width: 48%; }
.fm--setting-site .section01 .fm--radio-group + .fm--radio-group {}
.fm--setting-site .fm--form-domain {display: none; }



/* section02 사이트 정보
-------------------------------------------*/
.fm--setting-site .fm--form-container {padding: 24px 0 0; }
.fm--setting-site .section02 .fm--form-container {padding: 0; }
.fm--setting-site .form-textstyle .fm--label-text {margin-right: 24px; }


/* 로고 등록 */
.fm--setting-site .fm--box-upload-logo {display: none; margin-top: 16px; }
.fm--setting-site .fm--box-upload-logo:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.fm--setting-site .fm--box-upload-logo .fm--title {font-size: 14px; }

.fm--setting-site .fm--box-upload-logo .fm--upload-contents {width: 100%; }

.fm--setting-site .fm--box-upload-logo .fm--upload-wrapper {}
.fm--setting-site .fm--box-upload-logo .fm--upload-wrapper:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.fm--setting-site .fm--box-upload-logo .fm--upload-file  {position: relative; float: left; width: calc(100% - 94px); }
.fm--setting-site .fm--box-upload-logo .fm--upload-file .fm--input-file {display: block; width: 100%; height: 45px; margin: 0; padding: 0 38px 0 8px; background-color: #fff;  border: 1px solid #cbcbcb; border-radius: 5px;  box-sizing: border-box; font-size: 14px; font-weight: 400; line-height: 1.5; color: #4f4f4f; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; }
.fm--setting-site .fm--box-upload-logo .fm--upload-file .fm--btn-file-delete {position: absolute; right: 8px; top: 12px; z-index: 10; width: 24px; height: 24px; display: block; padding: 0; border: 0; background-image: url("/images/fieldmake/mobile/common/file_delete.png"); background-repeat: no-repeat; background-position: center; background-size: 18px 18px; }

.fm--setting-site .fm--box-upload-logo .fm--btn-group {position: relative; float: left;  margin-left: 4px; }
.fm--setting-site .fm--box-upload-logo .fm--btn-group .fm--btn-upload {width: 90px; }


/* 이미지 등록 */
.fm--setting-site .fm--box-upload-thumb {padding: 24px 20px; text-align: center; }

.fm--setting-site .fm--box-upload-thumb .fm--box-upload-img {}
.fm--setting-site .fm--box-upload-thumb .fm--upload-img {width: 120px; height: 120px; margin:0 auto; overflow: hidden; background-repeat: no-repeat; background-size: 120px 120px; background-position: center center; border: 1px solid #f0f0f0; border-radius: 999px; }
.fm--setting-site .fm--box-upload-thumb .fm--btn-file-delete {position: absolute; right: 50%; top: 15px; z-index: 10; width: 24px; height: 24px; display: block; margin-right: -60px; padding: 0; background: url("/images/fieldmake/mobile/common/file_delete.png") no-repeat center; border: 0; }

.fm--setting-site .fm--box-upload-thumb .fm--box-upload-guide {margin-top: 8px; font-size: 13px; color: #8f8f8f; }
.fm--setting-site .fm--box-upload-thumb .fm--btn-upload {width: 100%; height: 40px; margin-top: 16px; line-height: 28px; }





/* =======================================================
	service option
========================================================*/
.fm--setting-option section {padding: 32px 20px; }
.fm--setting-option section + section {border-top: 2px solid #eee;}
.fm--setting-option .fm--title-wrapper {margin-bottom: 24px; }

/* 버전선택 */
.fm--setting-option .section01:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.fm--setting-option .section01 .left,
.fm--setting-option .section01 .right {width: calc(50% - 2%); }
.fm--setting-option .section01 .fm--radio-group {margin-bottom: 8px; }
.fm--setting-option .section01 .fm--radio-group .fm--label-text {font-size: 15px; font-weight: 400;}
.fm--setting-option .section01 li {margin-bottom: 8px; font-size: 13px; color: #4f4f4f; }
.fm--setting-option .section01 li:last-child {margin-bottom: 0; }


/* 옵션선택 */
.fm--setting-option .fm--plus-option-list {width: 100%;  box-sizing: border-box; }

.fm--setting-option .fm--plus-option {position: relative; border-radius: 5px; box-sizing: border-box; background-color: #fff; overflow:hidden; }
.fm--setting-option .fm--plus-option .fm--text-guide {margin: 8px; }
.fm--setting-option .fm--plus-option  + .fm--plus-option {margin-top: 8px;}

.fm--setting-option .fm--plus-option label {display: block; padding: 16px 16px 16px 45px; background-image: url("/images/fieldmake/mobile/sub/check.png"); background-repeat: no-repeat; background-position: 16px center; background-size: 14px; border: 1px solid #e6e4e4; border-radius: 5px; box-sizing: border-box; }
.fm--setting-option .fm--plus-option input:checked ~ label {border-color: #6c30e0; background-image: url("/images/fieldmake/mobile/sub/check_on.png"); }
.fm--setting-option .fm--plus-option strong {font-size: 14px; color: #222; font-weight: 400; }
.fm--setting-option .fm--plus-option strong + span {display: block; padding-top: 4px; font-size: 13px; color: #6f6f6f; font-weight: 400; }

.fm--setting-option .fm--sub-option-list  {display: none; position: relative; border: 1px solid #e6e4e4; border-top: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }
.fm--setting-option .fm--sub-option-list.active {display: block; }
.fm--setting-option .fm--sub-option-list .fm--plus-option {margin: 0; border: 0; border-top: 1px solid #e6e4e4; border-radius: 0; background-color: #fafafa;}
.fm--setting-option .fm--sub-option-list .fm--plus-option:first-child {border-top: 0; }
.fm--setting-option .fm--sub-option-list .fm--plus-option:last-child {border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }
.fm--setting-option .fm--sub-option-list .fm--plus-option label {border: 0; }





/* =======================================================
	service finish
========================================================*/
.fm--setting-finish section {padding: 32px 20px; }
.fm--setting-finish section + section {border-bottom: 2px solid #eee;}
.fm--setting-finish .fm--title-wrapper {margin-bottom: 24px; }


/* 가입환영
----------------------------------*/
.fm--setting-finish .fm--box-welcome {padding: 32px 20px; background-color: rgba(108, 48, 224, 0.05); text-align: center; }
.fm--setting-finish .fm--box-welcome .fm--welcome-title {font-size: 22px; color: #6c30e0; font-weight: 500; margin-bottom: 16px; }
.fm--setting-finish .fm--box-welcome p {font-size: 14px; color: #222; }
.fm--setting-finish .fm--box-welcome p a {text-decoration: underline; }

.fm--setting-finish .fm--dl-info dt {padding-left: 8px; background-image: url("/images/fieldmake/mobile/common/bul_circle02.png"); background-repeat: no-repeat; background-position: left center; font-size: 16px; color: #444; }
.fm--setting-finish .fm--dl-info dd {padding: 4px 0; box-sizing: border-box;font-size: 14px; color: #4f4f4f; }

.fm--setting-finish dd.fm--dl-info-guide {width: 100%; margin-top: 8px; box-sizing: border-box; }



/* section01 디자인 정보
----------------------------------*/
.fm--setting-finish .section01 {padding: 20px 20px 40px; box-sizing: border-box; border-top: 1px solid #e6e4e4; border-bottom: 2px solid #eee;}

.fm--setting-finish .fm--preview-img {width: 100%; height: auto; border: 1px solid #d7d7d7; border-radius: 5px; box-sizing: border-box; }
.fm--setting-finish .fm--preview-img img {width: 100%; border-radius: 5px; vertical-align: middle; }

.fm--setting-finish .fm--preview-logo {margin-top: 8px; width: 100%; padding: 16px 16px; border: 1px solid #d7d7d7; border-radius: 5px; box-sizing: border-box; }
.fm--setting-finish .fm--preview-logo img {display: block; width: 140px;  margin: 0 auto; }

.fm--setting-finish .fm--dl-color dd:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.fm--setting-finish .fm--box-design .fm--dl-color dd * {float: left; }
.fm--setting-finish .fm--dl-color dd em {display: inline-block; font-style: normal; vertical-align: top; }
.fm--setting-finish .fm--dl-color dd span {vertical-align: top; }
.fm--setting-finish .fm--preview-color {display: inline-block; width: 75px; height: 20px; border: 1px solid #d7d7d7; margin-right: 8px; }



/* section02 사이트 정보
----------------------------------*/
.fm--setting-site .fm--input-message {margin-top: 8px;}

/* 판매자 정보
-------------------------------------------*/



/* secction03 버전 및 옵션
----------------------------------*/
.fm--setting-finish .fm--box-white {border: 0; padding: 0; }
.fm--setting-finish .fm--plus-option {margin-top: 10px; padding-left: 5px; }
.fm--setting-finish .fm--plus-option strong {display: inline-block; padding-left: 16px; background-image: url("/images/fieldmake/mobile/sub/check_on.png"); background-repeat: no-repeat; background-position: left center; background-size: 12px auto; font-size: 14px; color: #222; font-weight: 400; vertical-align: top; }
.fm--setting-finish .fm--plus-option span {display: block; padding-top: 4px; padding-left: 16px; font-size: 13px; color: #6f6f6f; font-weight: 400; vertical-align: top; }


.fm--setting-finish > .fm--text-guide {margin: 16px 20px 0; }
.fm--setting-finish .fm--btn-bottom-group {border-top: 0; }




/* =======================================================
	service account
========================================================*/
.fm--setting-account section {padding: 32px 20px; }
.fm--setting-account section + section {border-top: 2px solid #eee;}
.fm--setting-account .fm--dl-form {padding: 0; }
.fm--setting-account .fm--title-wrapper {margin-bottom: 24px; }
.fm--setting-account .fm--form-wrapper {padding-top: 0; border-top: 0; }

.fm--setting-account .section01 .fm--account-person {display: none; }
.fm--setting-account .section01 .fm--account-person.active {display: block; margin-top: 24px;}
.fm--setting-account .section01 .fm--account-company {display: none; }
.fm--setting-account .section01 .fm--account-company.active {display: block; margin-top: 24px;}

.fm--setting-account .fm--account-defult .fm--label-text {margin-right: 40px; }


/* 입금 계좌 정보 */
.fm--setting-account .fm--account-text {margin-top: 8px; margin-left: 4px; font-size: 13px; color: #4f4f4f; }





/* =======================================================
	solution
========================================================*/
.fm--solution .fm--solution-check {margin: 0 auto; margin-top: 16px; }
.fm--solution .fm--solution-check:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.fm--solution .fm--solution-check .fm--label-text {max-width: calc(100% - 110px); }
.fm--solution .fm--solution-check .fm--label-text .fm--font-main {font-size: 0.8em; margin-left: 4px; margin-right: 0;  }
.fm--solution .fm--solution-check .fm--btn-small {float: left; margin-left: 8px;  }







@media all and (min-width: 320px) and (max-width: 374px) {

	/* 디자인설정
	-------------------------------------------*/
	.fm--setting-design .fm--type-item .fm--radio-group .fm--label-text {max-width: 110px;}


	/* 사이트설정
	-------------------------------------------*/

	.fm--setting-site .fm--box-upload-thumb .left {width: 48%; }
	.fm--setting-site .fm--box-upload-thumb .fm--upload-img {width: 110px; height: 110px; background-size: 110px 110px; }
	.fm--setting-site .fm--box-upload-thumb .right {width: 48%; }


	/* 옵션설정
	-------------------------------------------*/
	.fm--setting-option .section01 .left,
	.fm--setting-option .section01 .right {width: 100%; }
	.fm--setting-option .section01 .left {margin-bottom: 16px; }


	/* 솔루션
	-------------------------------------------*/
	.fm--solution .fm--solution-check .fm--btn-small {float: left; margin: 8px 0 0 24px;  }
}



@media all and (min-width: 375px) and (max-width: 480px) {

	/* 옵션설정
	-------------------------------------------*/
	.fm--setting-option .section01 .left,
	.fm--setting-option .section01 .right {width: 100%; }
	.fm--setting-option .section01 .left {margin-bottom: 24px; }

}


@media all and (min-width: 768px) {

	/* 사이트설정
	-------------------------------------------*/
	.fm--setting-site .fm--box-upload-thumb .left {width: 25%; }
	.fm--setting-site .fm--box-upload-thumb .right {width: 75%; }
/*	.fm--setting-site .section01 .fm--radio-group + .fm--radio-group {margin-top: 0; margin-left: 40px; }*/


	/* 옵션설정
	-------------------------------------------*/
	.fm--setting-option .section01 .fm--box-white {min-height: 135px; }

	.fm--setting-option .fm--plus-option > ul {display: block; position: relative; margin: 8px 0 16px; padding-left: 32px; }
	.fm--setting-option .fm--plus-option > ul .fm--plus-option:before {content: ""; display: block; position: absolute; top: -8px; left: -22px; z-index: 0; width: 22px; height: 65px; background-image: url("/images/fieldmake/mobile/sub/myfield_option_line.png"); background-repeat: no-repeat; background-position: left top; }
	.fm--setting-option .fm--plus-option > ul .fm--plus-option:last-child:before {height: 35px; background-position: left top; }

}
