@charset "UTF-8";


/*
html {
	font-size: 62.5%;
	line-height: 1.6;
}
*/

body {
	color: #4a4a4a;
	background-color: #ffffff;
	-webkit-text-size-adjust: none;
	font-feature-settings: "palt" on;

}

img {
	max-width: 100%;
	vertical-align: top;
}

.pdb { padding-bottom: 20px; }

.attn { padding-top: 20px; padding-bottom: 20px; }

/* header */
.header {
	position: relative;
	color: #ffffff;
}

.img-hd {
	width: 100%;
}

.img-hd-02 {
	width: 100%;
	position: absolute;
}

@media (min-width: 768px) {
	.box-logo {
		position: absolute;
		top:10%;
		left:8%;
	}
	.img-logo {
		position: absolute;
		width: 25%;
	}
	.h1-hd {
		position: absolute;
		top:25%;
		left:8%;
		padding-left:15px;
		font-size: 2em;
		font-weight: bold;
		color: #ffffff;
	}
	.exp-hd {
		position: absolute;
		top:50%;
		left:8%;
		font-size: 1.3em;
		color:#ffffff;
	}

	.box-logo-02 {
		position: absolute;
		top:30%;
		left:8%;
	}
	.img-logo-02 {
		position: absolute;
		width: 25%;
	}

}

@media (max-width: 768px) and (min-width: 480px) {
	.box-logo {
		position: absolute;
		top:10%;
		left: 0;
		right: 0;
		margin: 0 auto;
		width: 140px;
		height: 26px;
	}
	.img-logo {
		position: absolute;
		width: 25%;
	}
	.h1-hd {
		position: absolute;
		top:20%;
		left:8%;
		font-size: 1.2em;
		font-weight: bold;
		color: #ffffff;
	}
	.exp-hd {
		position: absolute;
		top:50%;
		left:2%;
		font-size: 1.0em;
		color:#ffffff;
	}

	.box-logo-02 {
		position: absolute;
		top:30%;
		left: 0;
		right: 0;
		margin: 0 auto;
		width: 140px;
		height: 26px;
	}
	.img-logo-02 {
		position: absolute;
		width: 25%;
	}

}

@media (max-width: 479px) {
	.box-logo {
		position: absolute;
		top:10%;
		left: 0;
		right: 0;
		margin: 0 auto;
		width: 140px;
		height: 26px;
	}
	.img-logo {
		position: absolute;
		width: 25%;
	}
	.h1-hd {
		position: absolute;
		top:20%;
		left:8%;
		font-size: 1em;
		font-weight: bold;
		color: #ffffff;
	}
	.exp-hd {
		position: absolute;
		top:50%;
		left:2%;
		font-size: 0.8em;
		color:#ffffff;
	}

	.box-logo-02 {
		position: absolute;
		top:30%;
		left: 0;
		right: 0;
		margin: 0 auto;
		width: 140px;
		height: 26px;
	}
	.img-logo-02 {
		position: absolute;
		width: 25%;
	}

}

/* header closed */


@media (min-width: 768px) {
	.h1-mn {
		width: 100%;
		text-align: center;
		font-size: 2.0em;
		font-weight: bold;
		color: #66b574;
		padding: 2em 0;
	}
	
	.exit-box {
		text-align: center;
		padding: 40px;
	}
	.exit-box img {
		width: 60%;
	}

}
@media (max-width: 767px) {
	.h1-mn {
		width: 100%;
		text-align: center;
		font-size: 1.4em;
		font-weight: bold;
		color: #66b574;
		padding: 2em 0;
	}
	
	.exit-box {
		text-align: center;
		font-size: 0.8em;
	}
	.exit-box img {
		width: 80%;
	}

}

h2 {
	font-size: 1em;
	font-weight: normal;
}

.main-box {
	padding: 40px 8px;
	
	
}

.main-exp {
	word-wrap: break-word;
}


.btn-box button {
	color: #ffffff;
	background-color: #66b574;
	border: 1px solid #66b574;
	text-align: center;
	font-weight: bold;
	padding: 8px 16px;
	width: 100%;
	font-size: 0.8em;
}



.footer-top {
	background-color: #585865;
	color: #e3e3e5;
	text-align: center;
	padding: 16px;
}
.footer-bottom {
	background-color: #53535e;
	color: #e3e3e5;
	text-align: center;
	padding: 16px;
}

.cmnt {
	font-size: 0.8em;
	color: #666666;
}


.sbj { color: #66b574; }


a:link, a:visited {
	color: #66b574;
	text-decoration: none;
}

a:hover, a:active, a:focus {
	color: #59c06c;
	text-decoration: underline;
}

button:link, button:visited {
	color: #ffffff;
	background-color: #66b574;
	border: 1px solid #66b574;
}

button:hover, button:active, button:focus {
	color: #ffffff;
	background-color: #58a273;
	border-color: #58a273;
}

.center-text { text-align: center; }


/* footer */

.footer-top {
	margin-top: 40px;
}

.footer-top a:link, .footer-top a:visited {
	color: #e3e3e5;
	text-decoration: none;
}

.footer-top a:hover, .footer-top a:active, .footer-top a:focus {
	color: #ffffff;
	text-decoration: underline;
}

/* footer closed */


/* landing */

.landing-box {
	background-color: #f0f0f0;
	padding: 40px 0px;
	margin-bottom: 20px;
	text-align: center;
}


.lan-sbj {
	font-size: 1.2em;
	font-weight: bold;
	width: 100%;
	text-align: center;
}

.lan-icon {
	height: 150px;
	margin-bottom: 16px;
}

.lan-txt {
	width: 100%;
	padding: 4px;
	word-wrap: break-word;
	text-align: left;
}

.lan-btn-large
{
  font-size: 250%;
  line-height: 0.8em;
  font-style: oblique;
}

.lan-error { color: #EF2400; }

.lan-error a
{
  color: #FF0000;
  text-decoration: underline;
}

/* landing closed */


/* license */

.key-box
{
	margin-top: 10px;
	margin-bottom: 20px;
	border-radius: 10px;
	padding: 4px 20px;
	text-align: center;
	border: 1px solid #66b574;
}

.howto-sbj {
	margin: 40px 0px;
	padding: 16px;
	text-align: center;
	background-color: #66b574;
	color: #ffffff;
	font-size: 2.0rem;
}

table, tr, th, td { border: none; }
.howto-box th {
	border: none;
	padding: 8px;
	font-style: italic;
	font-size: 2.0em;
}
.howto-box td {
	border: none;
	padding: 8px;
}


/* 
ol {
	list-style-type: none;
	counter-reset: item;
	list-style-position: inside;
}
 */
ol li {
	padding-left: 2.0em;
	text-indent: -2.0em;
}

/* 
li:before {
	counter-increment: item;
	content: counter(item)'.';
}
 */

.pf-icon {
	padding: 8px;
	text-align: center;
}

/* license closed */


/* unsubscribe */

ul li { list-style:none; }
ul li:before { content:"- "; }


/* unsubscribe closed */


/* member */

.os-button {
	
	position: relative;
	margin: 8px;
	border:0;
	font-size:0;
	line-height:0;
	cursor:pointer;
	
	border: none;
	background-color: #66b574;
	border: 1px solid #66b574;
	overflow: visible;
	
}

.os-button img {
	display: block;
	width: 100%;
}

.os-button p {
  position: absolute;
	color: #ffffff;
	bottom: 14px;
	left: 0;
	right: 0;
	margin: 0 auto;
	font-size: 18px;
	font-weight: bold;
}


.os-ps { width:100%; margin: 0; padding: 0; }
.os-ps td { width:50%; margin: 0; padding: 0; }

@media (max-width: 767px) {
.os-button {
	width: 90px;
	width: 90px;
}
	.os-and { padding: 16px 24px 30px 24px; margin: 10px; }
	.os-ios { padding: 16px 24px 34px 24px; margin: 10px; }
	.os-win { padding: 16px 24px 34px 24px; margin: 10px; }
	.os-mac { padding: 16px 24px 34px 24px; margin: 10px; }
}
@media (min-width: 768px) {
.os-button {
	width: 120px;
	width: 120px;
}
	.os-and { padding: 16px 24px 24px 24px; }
	.os-ios { padding: 16px 24px 32px 24px; }
	.os-win { padding: 16px 24px 32px 24px; }
	.os-mac { padding: 16px 24px 32px 24px; }
}
@media (min-width: 1024px) {
.os-button {
	width: 120px;
	width: 120px;
}
	.os-and { padding: 16px 24px 24px 24px; }
	.os-ios { padding: 16px 24px 32px 24px; }
	.os-win { padding: 16px 24px 32px 24px; }
	.os-mac { padding: 16px 24px 32px 24px; }
}
@media (min-width: 1440px) {
.os-button {
	width: 120px;
	width: 120px;
}
	.os-and { padding: 16px 24px 24px 24px; }
	.os-ios { padding: 16px 24px 32px 24px; }
	.os-win { padding: 16px 24px 32px 24px; }
	.os-mac { padding: 16px 24px 32px 24px; }
}

.course
{
	padding-top: 2em;
	padding-bottom: 0;
	text-align: center;
}

.qr-img {	padding: 1em 0 2em 0;}

#option-dns
{
	border-top: 2px #CCC solid;
	margin-top: 2em;
}

ul.disc li
{
  list-style: disc;
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}

ul.disc li:before { content:""; }

/* member closed */

/* privacy */
ul.pri li
{
  list-style: disc;
}

ul.pri li:before { content:""; }

.pri-sbj2 {
	font-size: 1em;
	font-weight: bold;
	width: 100%;
	margin-top: 2em;
}
.pri-sbj3 {
	font-size: 1em;
	font-weight: bold;
	width: 100%;
}

/* privacy closed */

/* common */

.red { color: #FF0000; }
.blue { color: #0000FF; }
.small { font-size: 90%; }
.breakurl { word-break: break-all; }
.clear-both { clear: both; }
a:link.orangered, a:visited.orangered {
	color: #FF4500;
}
a:hover.orangered, a:active.orangered, a:focus.orangered {
	color: #FF4500;
	text-decoration: underline;
}
ol.steps { padding-left: 2em; }
ol.steps li { padding-left: 1em;
text-indent: 0em;
padding-bottom: 1.5em;
}

/* common closed */