* {
		margin:0;
		padding:0;
	}
	*, *:before, *:after {
		box-sizing: border-box;
	}

	body {
		background: #eee;
	}
	.contentsWrap {
		background: #eee;
		min-width: 1280px;
	}
	.header {
		background: #fff;
    box-shadow: 0px 6px 8.73px 0.27px rgba(0, 0, 0, 0.2);
    text-align: center;
	}
	.header a {
		color: #1d3994;
	}
	.headInner {
		max-width: 1280px;
    margin: 0 auto;
		padding: 12px 0;
    position: relative;
	}
	.headTtl {
		font-size: 20px;
		font-weight: bold;
		color: #421e14;
		line-height: 1.2;
		letter-spacing: 0.04em;
	}
	.headTtl>span {
		font-size: 16px;
		font-weight: normal;
	}
	.headTtl .version {
		font-size: 12px;
	}
	.copyright {
		font-size: 12px;
		color: #000;
		line-height: 1;
		position: absolute;
		right: 0;
		bottom: 17px;
	}
	.toolWrap {
		display: flex;
		justify-content: center;
	}
	.tool {
		width: 1205px;
		display: flex;
	}
	.copyNone {
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}
	/* オペレーションエリア */
	.oprArea {
		width: 550px;
		padding-top: 25px;
	}
	#dropArea {
    width: 420px;
    height: 210px;
    border: 2px dotted #012b77;
    background: #d5e0f5;
    transition: all 0.25s cubic-bezier(0.21, 0.51, 0.51, 1);
		margin: 0 64px 38px 66px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.dropNote {
		font-size: 18px;
		color: #012b77;
		font-weight: bold;
		display: flex;
		align-items: center;
	}
	.dropNote:before {
		display: block;
		content: '';
		width: 50px;
		height: 58px;
		background: url(lib/img/tool/ico_drop.png) 0 0 no-repeat;
		background-size: contain;
		margin: 0 20px 0 5px;
	}
	#dropArea.dragover {
		background: #aec7f7;
		transform: scale(1.05);
	}
	#failMsg {
		color: #f00;
		display: none;
	}
	#fileInput {
		display: none;
	}
	/*リセット */
	input {
    margin: 0;
		padding: 0;
		background: none;
		border: none;
		border-radius: 0;
		outline: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		display: none;
  }

	#topicsCheckArea {
		width: 440px;
    margin: 0 54px 0 56px;
		visibility: hidden;
	}
	#topicsCheckArea.show {
		visibility: visible;
	}
	/* チェックボックス */
	.checkBoxOuter {
		padding: 10px;
	}
	.checkBoxWrap {
		background: #fff;
		box-shadow: 0px 6px 8.73px 0.27px rgba(0, 0, 0, 0.2);
	}
	.checkBoxInner {
		padding: 34px 10px 16px 20px;
		background: #fff;
	}
	.checkTtl {
		font-size: 26px;
		font-weight: bold;
		color: #421e14;
		margin-left: 10px;
		width: 100%;
	}
	.nickname {
		display: flex;
		align-items: center;
		font-size: 16px;
		color: #012b77;
		border-bottom: 1px solid #012b77;
		padding: 22px 34px  22px 34px;
	}
	.nickname>span:nth-of-type(2) {
		font-size: 30px;
		font-weight: bold;
		margin-left: 30px;
	}
	.checkLabel {
		display: block;
		font-size: 14px;
		cursor: pointer;
		position: relative;
		padding-left: 45px;
		margin-bottom: 20px;
		height: 30px;
		display: flex;
		align-items: center;
	}
	.checkLabel.inactive {
		pointer-events: none;
    color: #7a7a7a;
	} 
	.checkLabel::before {
		display: block;
		content: '';
		background: #d5e0f5;
		width: 30px;
		height: 30px;
		margin-right: 15px;
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		margin: auto;
	}
	.checkLabel.inactive:before {
		background: #bfbfbf;;
	}
	.checkLabel::after {
		border-right: 2px solid #fff;
		border-bottom: 2px solid #fff;
		display: block;
		content: '';
		width: 8px;
		height: 18px;
		opacity: 0;
		position: absolute;
		top: 4px;
    left: 12px;
		transform: rotate(45deg);
	}
	input[type=checkbox]:checked + .checkLabel::after {
		opacity: 1;
	}
	input[type=checkbox]:checked + .checkLabel::before {
		display: block;
		content: '';
		background: #012b77;
		width: 30px;
		height: 30px;
	}
	input[name=point] {
		display: inline-block;
		width: 70px;
		border: 1px solid #beceed;
		padding: 8px 4px 5px;
		text-align: right;
	}

	/* プレビューエリア */
	.prevArea {
		width: 792px;
		padding: 18px 22px 0;
		display: flex;
	}
	.prevBox {
		width: 436px;
		height: 859px;
		margin-right: 12px;
		position: relative;
	}
	.prevBox:after {
		display: block;
		content: '';
		width: 100%;
		height: 100%;
		background: url(lib/img/tool/bg_mobile.png) 0 0 no-repeat;
		background-size: contain;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		margin: auto;
		z-index: 2;
		pointer-events: none;
	}
	.prevInner {
		width: 375px;
    height: 808px;
    overflow: hidden;
    position: absolute;
    top: 21px;
    left: 26px;
    border-radius: 20px;
		background: #fff;
	}
	.prevHeader {
		width: 375px;
		height: 68px;
		background: url(lib/img/tool/img_header.jpg) 0 0 no-repeat;
		background-size: contain;
		box-shadow: 0px 6px 8.73px 0.27px rgba(0, 0, 0, 0.2);
		position: relative;
		z-index: 1;
	}
	#sendDate {
		position: absolute;
    left: 68px;
    top: 36px;
    font-size: 12px;
    color: #ccc;
    text-align: right;
	}
	.mailTo {
		position: absolute;
    left: 106px;
    top: 35px;
    font-size: 13px;
    font-weight: bold;
    color: #000;
	}
	#mailTtl {
		font-size: 20px;
		font-weight: bold;
		color: #000;
		background: #fff;
		padding: 15px 25px 0;
		display: none;
	} 
	#prev {
		width: 750px;
		height: 1385px;
		overflow-x: hidden;
		overflow-y: scroll;
		transform: scale(0.5, 0.5) translate(-50%, -50%);
		display: none;
	}

	/* ローディング */
	#loading {
		width: 140px;
		position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
		display: none;
	}
	/* =Elements style
	---------------------- */
	.load-wrapp {
		width: 140px;
		padding: 20px 20px 20px;
		border-radius: 5px;
		text-align: center;
		background-color: #d8d8d8;
	}

	.line {
		display: inline-block;
		width: 15px;
		height: 15px;
		border-radius: 15px;
		background-color: #4b9cdb;
	}
	.letter-holder {
		padding: 16px;
	}

	.letter {
		float: left;
		font-size: 14px;
		color: 777;
	}

	/* =Animate the stuff
	------------------------ */

	.load-3 .line:nth-last-child(1) {
		animation: loadingC 0.6s 0.1s linear infinite;
	}
	.load-3 .line:nth-last-child(2) {
		animation: loadingC 0.6s 0.2s linear infinite;
	}
	.load-3 .line:nth-last-child(3) {
		animation: loadingC 0.6s 0.3s linear infinite;
	}
	.load-6 .letter {
		animation-name: loadingF;
		animation-duration: 1.6s;
		animation-iteration-count: infinite;
		animation-direction: linear;
	}

	.l-1 {
		animation-delay: 0.48s;
	}
	.l-2 {
		animation-delay: 0.6s;
	}
	.l-3 {
		animation-delay: 0.72s;
	}
	.l-4 {
		animation-delay: 0.84s;
	}
	.l-5 {
		animation-delay: 0.96s;
	}
	.l-6 {
		animation-delay: 1.08s;
	}
	.l-7 {
		animation-delay: 1.2s;
	}
	.l-8 {
		animation-delay: 1.32s;
	}
	.l-9 {
		animation-delay: 1.44s;
	}
	.l-10 {
		animation-delay: 1.56s;
	}

	@keyframes loadingC {
		0% {
			transform: translate(0, 0);
		}
		50% {
			transform: translate(0, 15px);
		}
		100% {
			transform: translate(0, 0);
		}
	}

	@keyframes loadingF {
		0% {
			opacity: 0;
		}
		100% {
			opacity: 1;
		}
	}
	
	.btnWrap {
		width: 100%;
	}
	.btn {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 200px;
		border-radius: 10px;
		font-size: 18px;
		text-align: center;
		text-decoration: none;
		padding: 10px;
		cursor: pointer;
		margin-bottom: 10px;
	}
	.btn#sendMail {
		width: 300px;
		height: 120px;
		background: #012b77;
		font-size: 20px;
		font-weight: bold;
		color: #fff;
		text-align: center;
		padding-top: 25px;
		box-shadow: 0px 6px 8.73px 0.27px rgba(0, 0, 0, 0.2);
		border-radius: 8px;
		margin-bottom: 20px;
	}
	.btn#sendMail.inactive{
		pointer-events: none;
		background: #bfbfbf;
		color: #7a7a7a;
	}
	.btn#sendMail>span:before {
		display: block;
		content: '';
		width: 51px;
		height: 33px;
		background: url(lib/img/tool/ico_mail.png) 0 0 no-repeat;
		background-size: contain;
		margin: 0 auto 20px;
	}
	.linkWrap {
		font-size: 14px;
		line-height: 1.7;
		color: #000;
		text-align: center;
	}
	#dlHtml {
		display: block;
		color: #37a1cb;
	}
	#dlHtml.inactive {
		pointer-events: none;
		color: #7a7a7a;
	}

	/* scrollbar custom */
	::-webkit-scrollbar {
		background: #dedede;
		width:16px;
		border-radius: 8px;
	}
	::-webkit-scrollbar-thumb {
		background-color: #012b77;
		border-radius: 8px;
	}

	/* 異常トピックススライド */
	.swiperArea {
		position: relative;
	}
	.swiper-button-next,
	.swiper-button-prev {
		width: 50px;
		height: 50px;
		border-radius: 50%;
		background: #012b77;
		position: absolute;
		top: 272px;
		box-shadow: 0px 6px 8.73px 0.27px rgba(0, 0, 0, 0.26);
	}
	.swiper-button-next {
		right: -55px;
	}
	.swiper-button-prev {
		left: -55px;
	}
	.swiper-button-next:after,
	.swiper-button-prev:after{
		display: block;
		content: '';
		width: 16px;
		height: 16px;
		border-top: 3px solid #fff;
		border-left: 3px solid #fff;
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
	}
	.swiper-button-next:after{
		left: 13px;
		transform: rotate(135deg);
	}
	.swiper-button-prev:after{
		right: 13px;
		transform: rotate(-45deg);
	}
	.swiper-button-next.swiper-button-disabled,
	.swiper-button-prev.swiper-button-disabled{
		opacity: 1;
		background: #d3d3d3;
	}

	/* BCC */
	.rightColumn {
		display: flex;
		flex-flow: column;
		justify-content:space-between;
		padding: 90px 0 50px;
	}
	#bccBox {
		font-size: 16px;
		line-height: 1.7;
		width: 300px;
		background: #fff;
		box-shadow: 0px 6px 8.73px 0.27px rgba(0, 0, 0, 0.26);
		padding: 18px 12px;
		visibility: hidden;
	}
	#bccBox.show {
		visibility: visible;
	}
	#to,
	#bcc {
		font-size: 14px;
	}
	#to {
		margin-bottom: 16px;
	}