/*-----------------------------------------------------------------------------------
	= Table of Contents

	1. = Body, Typography and some main Elements
	2. = Structure
	3. = Page styling


/*-----------------------------------------------------------------------------------*/
/* 1. = Body, Typography and some main Elements
/*-----------------------------------------------------------------------------------*/

html * { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -webkit-font-smoothing:antialiased; -moz-font-smoothing:antialiased;  }
body { font-size:16px; color:#2C2C2E; font-family:Arial, Helvetica, sans-serif; overflow-x:hidden; background:#EFEFEF; }
input, textarea, select, label { font-family:Arial, Helvetica, sans-serif; outline:0; border-radius:0; box-shadow:none; }
input:focus, input:hover { outline:0; }
::-webkit-input-placeholder { color:#8E8F93; opacity:1; }
:-moz-placeholder { color:#8E8F93; opacity:1; }
::-moz-placeholder { color:#8E8F93; opacity:1; }
:-ms-input-placeholder { color:#8E8F93; opacity:1; }
h1, h2, h3, h4, h5, h6 { padding:0; margin:0 0 25px 0; font-size:700; line-height:1.3; }
h1 { font-size:48px; }
h2 { font-size:48px; }
h3 { font-size:32px; }
h4 { font-size:24px; }
h5 { font-size:16px; }
h6 { font-size:16px; }
img { display:block; max-width:100%; height:auto; }
ul,ol { margin:0; padding:0; list-style:none; }
a, a:visited, a:active { text-decoration:none; -webkit-transition:all .3s ease-out; -moz-transition:all .3s ease-out; -o-transition:all .3s ease-out; -ms-transition:all .3s ease-out; transition:all .3s ease-out; }
a:focus, a:hover { text-decoration:none; outline:0; }
:focus, :hover { text-decoration:none; outline:0; }
p { margin:0 0 15px 0; line-height:1.5; }



/*-----------------------------------------------------------------------------------*/
/* 2. = Structure
/*-----------------------------------------------------------------------------------*/

.container { 
	max-width:600px; 
	margin:0 auto; 
	padding-left:0; 
	padding-right:0; 
	width:auto; 
}



/*-----------------------------------------------------------------------------------*/
/* 3. = Page styling
/*-----------------------------------------------------------------------------------*/

.top-hero-section { 
	height:200px; 
	background:url(../images/search-top-hero.png) no-repeat center center / cover; 
	text-align:center; 
	display:flex; 
	align-items:center; 
	justify-content:center; 
	column-gap:10px;
}

.top-hero-section h1 {
	margin:0;
	font-size:24px;
	color:#FFF;
	font-weight:700;
	letter-spacing:1px;
}

.search-form-section {
	padding:30px 0;
	border-radius:10px 10px 0 0;
	margin:-15px  0 0;
	position:relative;
	background:#EFEFEF;
	text-align:center;
}

.search-form-section input[type=text] {
	width:100%;
	border-radius:10px;
	border:1px solid #d9d9de;
	background:#FFF;
	height:50px;
	line-height:50px;
	padding:0 15px;
	font-size:16px;
	text-align:center;
	margin:0 0 20px 0;
}

.search-form-section input[type=submit] {
	width:320px;
	border-radius:10px;
	border:none;
	background:#426CF6;
	height:50px;
	font-size:18px;
	text-align:center;
	margin:0 auto;
	display:block;
	font-weight:700;
	color:#FFF;
	transition:all .3s ease-out;
}

.search-form-section input[type=submit]:hover {
	background:#2C2C2E;
	color:#FFF;
}
.search-form-section .notice {
	font-size:14px;
	margin:-10px 0 20px 0;
	color:#FF0000;
	text-align:left;
	display:none;
}


.search-results-section {
	padding:0 0 50px 0;
}

.search-results-section h3 {
	font-weight:700;
	font-size:18px;
	margin:0 0 10px 0;
}

.search-results-section ul {
	margin:0;
	padding:0;
	list-style:none;
}

.search-results-section ul li {
	margin:0 0 20px 0;
	padding:0;
	list-style:none;
	background:#FFF;
	padding:15px 20px;
	font-size:14px;
}

.search-results-section ul li a {
	color:#2C2C2E;
}

.search-results-section ul li .type {
	display:flex;
	column-gap:6px;
	align-items:center;
	margin:0 0 5px 0;
}

.search-results-section ul li .type img {
	width:20px;
	height:auto;
}
.search-results-section ul li .type p {
	margin:0;
	font-size:12px;
}

.search-results-section ul li p {
	margin:0;
	font-size:14x;
}

.search-results-section ul li:last-child {
	margin:0;
}

.search-results-section .no-result {
	text-align:center;
	margin:0;
	color:#FF0000;
	font-size:24px;
}


.order-detail {
	font-size:16px;
	padding:30px 0;
	margin:0 auto;
	max-width:800px;
}

.order-detail h3 {
	background:#5D82FB;
	color:#FFF;
	font-size:18px;
	font-weight:700;
	margin:0;
	padding:12px 20px;
	letter-spacing:1px;
}

.order-detail ul {
	margin:0;
	padding:0;
	list-style:none;
}

.order-detail li {
	margin:0;
	list-style:none;
	padding:15px 20px;
	font-size:14px;
	display:flex;
	align-items:center;
}

.order-detail li label {
	width:120px;
	display:block;
	margin:0;
	font-weight:700;
}

.order-detail li p {
	margin:0;
	width:calc(100% - 140px);
}

.order-detail li:nth-child(odd) {
	background:#FFF;
}

.order-detail li:nth-child(even) {
	background:#EFEFEF;
}

.order-detail .button {
	background:#426CF6;
	color:#FFF;
	font-size:14px;
	padding:7px 15px;
	border-radius:5px;
}

.order-detail .button:hover {
	background:#5D82FB;
	color:#FFF;
}

.order-detail .image-list {
	padding:20px;
	background:#FFF;
}

.order-detail .image-list .item {
	margin:0 0 30px 0;
}

.order-detail .image-list p {
	font-size:14px;
	margin:0 0 5px 0;
	font-weight:700;
}

.order-detail .image-list ul {
	display:flex;
	column-gap:10px;
	row-gap:10px;
	flex-wrap:wrap;
}

.order-detail .image-list li {
	background:none;
	padding:0;
	width:calc(25% - 15px);
}

.order-detail .last-section li {
	display:block;
}

@media only screen and (max-width: 767px) { 

.container {
	padding-left:20px;
	padding-right:20px;
	max-width:none;
	width:100%;
}

.order-detail {
	padding:0;
	max-width:none;
	width:100%;
}

}






