﻿body {font-family: 'Roboto'; background-color: #ededed; margin: 0;}
.wrapper {display: inline-block; background-color: #fff; line-height: 1.1; margin-top: 10px;}
.wrapper .img_wrapper {height: 82px; width: 80px; margin: 0px 13px 0px 0px;}
.wrapper .img_wrapper img {width: 80px; position: relative; height: 82px;}
.container_block {padding-top: 20%; text-align: center;}
.container_block p {font-size: 25px; margin: 0px 0px 10px;}
.wrapper .text_wrapper {width: 269px; padding: 5px 13px 5px 0px;}
.wrapper .text_wrapper .title {font-size: 13.5px !important; line-height: 18px; max-height: 35px; overflow: hidden; margin: 4px 0px 8px; letter-spacing: 0.5px;}
.wrapper .text_wrapper .title .closer {position: relative; top: -6px;}
.title_txt {width: 96%;}
.wrapper .text_wrapper .message {margin: 8px 0px; max-height: 30px; min-height: 30px; overflow: hidden; font-size: 12px; line-height: 15px; font-weight: 400;}
.wrapper .text_wrapper .title, .wrapper .text_wrapper .message, .wrapper .text_wrapper .domain {text-align: left;}
.wrapper .text_wrapper .domain {font-size: 11px; color: #7f7f7f; letter-spacing: 0.5px;}
.powerby_txt {width: 475px; border-top: 1px solid #d7d7d7; color: #adadad; font-size: 14px; margin: 20px auto 0px; padding: 18px 0px 0px 0px; text-align: center;}
.powerby_txt a {color: #7f7f7f; text-align: center; cursor: pointer; text-decoration: none;}
.powerby_txt a:hover {text-decoration: none;}

.container {width: 100%;}
.pull-left {float: left!important;}
.row {margin: 0px;}
.m_b_20{margin-bottom: 20px;}

@media (max-width: 800px) {
	.content_wrap_noti {width: 100% !important; display: block !important;}
	.container_block {padding-top: 20%; text-align: center !important; margin: 0px !important;}
	.container {width: 100% !important; display: inline-block; margin: 0px !important;}
	.powerby_txt {width: 100% !important; display: block !important; margin: 15px 0px !important;}
}
@media (max-width: 768px) {
	.content_wrap_noti {width: 100% !important; display: block !important;}
	.container_block {padding-top: 20%; text-align: center !important; margin: 0px !important;}
	.container {width: 100% !important; display: inline-block; margin: 0px !important;}
	.powerby_txt {width: 100% !important; display: block !important; margin: 15px 0px !important;}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	body.noti_bg {width: 100%;}
	.content_wrap_noti {width: 100%;}
	.container_block {width: 100%; padding-top: 4% !important; display: block;}
	.container_block p {font-size: 22px;}
	.powerby_txt {width: 100%; margin: 15px auto 15px;}
}
@media (max-width: 629px) {
	.container_block {width: 100%; padding-top: 5% !important; display: block;}
}
@media (max-width: 578px) {
	.container_block {width: 100%; padding-top: 8% !important; display: block;}
	.subscription_button button {width: 60%;}
}
@media only screen and (min-width: 320px) and (max-width: 478px) {	
	body.noti_bg {width: 100%;}
	.content_wrap_noti {width: 100%;}
	
	.container_block p {font-size: 19px;}
	.wrapper .img_wrapper, .wrapper .img_wrapper img {height: 67px; width: 65px;}
	.wrapper .text_wrapper {width: 212px;}
	.wrapper .text_wrapper .title {font-size: 12px !important; letter-spacing: 0.3px; line-height: 16px;}
	.wrapper .text_wrapper .message {font-size: 11px;}
	.wrapper .text_wrapper .domain {font-size: 9px;}
	.powerby_txt {width: 100%; margin: 15px auto 0px;}
}
@media (max-width: 360px) {
	.container {width: 100%; padding-top: 15% !important; display: block;}
	.container_block p {font-size: 16px;}
	.wrapper .img_wrapper, .wrapper .img_wrapper img {height: 67px; width: 65px;}
	.wrapper .text_wrapper {width: 212px;}
	.wrapper .text_wrapper .title {font-size: 12px !important; letter-spacing: 0.3px; line-height: 16px;}
	.wrapper .text_wrapper .message {font-size: 11px;}
	.wrapper .text_wrapper .domain {font-size: 9px;}
	.powerby_txt {width: 100%; margin: 15px auto 0px;}
}
@media (max-width: 320px) {
	.container_block {width: 100%; padding-top: 28% !important; display: block;}
}