@charset "utf-8";

/***********************************************/
/* 全プロジェクトの公開側・管理画面で共通で使用するスタイルを記述する
/***********************************************/
/* IEでスクロールバーが重なる問題解決 */
@-ms-viewport {
    width:auto;
}

/* placeholderの色設定 */

/* 各ベンダープレフィックスが取れた標準版(http://caniuse.com/#search=placeholder-shown) */
:placeholder-shown {
    color: #9c9c9c;
}

/* Google Chrome, Safari, Opera 15+, Android, iOS */
::-webkit-input-placeholder {
    color: #9c9c9c;
}

/* Firefox 18- */
:-moz-placeholder {
    color: #9c9c9c;
}

/* Firefox 19+ */
::-moz-placeholder {
    color: #9c9c9c;
}

/* IE 10+ */
:-ms-input-placeholder {
    color: #9c9c9c;
}


/* リンク色設定 */
a {
    /*color: #c11843;*/
    color:#337ab7;
    cursor: pointer;
}

/* ボタン設定 */
button {
    cursor: pointer;
}

/* カラー設定 */
.red { color:#ff0000; }
.blue { color:#036EB8; }
.green { color:#009532; }
.white { color:#fff; }
.black { color: #3f3f3f; }

/* テキスト位置 */
.left{ text-align: left; }
.center{ text-align:center; }
.right{ text-align:right; }

/* テキスト装飾 */
.underline { text-decoration: underline; }

/* 要素配置 */
.f_left{ float: left; }
.f_right{ float: right; }
.mrl_auto {margin-left: auto; margin-right: auto;}
.m_auto{ margin:0 auto; }


/* ベースラインの設定 */
.top{ vertical-align: top; }
.middle{ vertical-align:middle; }
.sub{ vertical-align:sub; }
.bottom{ vertical-align:bottom; }


/* 改行禁止 */
.nowrap{ white-space:nowrap; }

/* ポジションの設定 */
.relative {
	position: relative;
}
.absolute {
    position: absolute;
	z-index:5;
}

/* フォント系 */
.b{ font-weight:bold; }
.nomal{ font-weight:normal;}
.light{ font-weight: lighter; }

.f10{ font-size: 10px; }
.f11{ font-size: 11px; }
.f12{ font-size: 12px; }
.f13{ font-size: 13px; }
.f14{ font-size: 14px; }
.f15{ font-size: 15px; }
.f16{ font-size: 16px; }
.f17{ font-size: 17px; }
.f18{ font-size: 18px; }
.f19{ font-size: 19px; }
.f20{ font-size: 20px; }
.f21{ font-size: 21px; }
.f22{ font-size: 22px; }
.f23{ font-size: 23px; }
.f24{ font-size: 24px; }
.f25{ font-size: 25px; }
.f27{ font-size: 27px; }
.f28{ font-size: 28px; }
.f34{ font-size: 34px; }
.f35{ font-size: 35px; }
.f36{ font-size: 36px; }
.f42{ font-size: 42px; }

.ls1{ letter-spacing: -1px;}
.ls2{ letter-spacing: -2px;}

.lh15 { line-height: 15px;}
.lh16 { line-height: 16px;}
.lh20 { line-height: 20px;}
.lh25 { line-height: 25px;}
.lh30 { line-height: 30px;}
.lh35 { line-height: 35px;}
.lh55 { line-height: 55px;}


/* 余白設定 */
.p1 { padding: 1px; }
.p2 { padding: 2px; }
.p3 { padding: 3px; }
.p5 { padding: 5px; }
.p10 { padding: 10px; }
.p30 { padding: 30px; }

.t2{ padding-top: 2px; }
.t3{ padding-top: 3px; }
.t5{ padding-top: 5px; }
.t7{ padding-top: 7px; }
.t10{ padding-top: 10px; }
.t15{ padding-top: 15px; }
.t20{ padding-top: 20px; }
.t25{ padding-top: 25px; }
.t30{ padding-top: 30px; }
.t40{ padding-top: 40px; }
.t50{ padding-top: 50px; }
.t60{ padding-top: 60px; }
.t70{ padding-top: 70px; }
.t75{ padding-top: 75px; }
.t90{ padding-top: 90px; }

.r3{ padding-right: 3px; }
.r5{ padding-right: 5px; }
.r7{ padding-right: 7px; }
.r10{ padding-right: 10px; }
.r15{ padding-right: 15px; }
.r20{ padding-right: 20px; }
.r25{ padding-right: 25px; }
.r30{ padding-right: 30px; }

.b2{ padding-bottom: 2px; }
.b3{ padding-bottom: 3px; }
.b5{ padding-bottom: 5px; }
.b7{ padding-bottom: 7px; }
.b10{ padding-bottom: 10px; }
.b15{ padding-bottom: 15px; }
.b20{ padding-bottom: 20px; }
.b25{ padding-bottom: 25px; }
.b30{ padding-bottom: 30px; }
.b40{ padding-bottom: 40px; }
.b70{ padding-bottom: 70px; }

.l3{ padding-left: 3px; }
.l5{ padding-left: 5px; }
.l7{ padding-left: 7px; }
.l10{ padding-left: 10px; }
.l15{ padding-left: 15px; }
.l20{ padding-left: 20px; }
.l25{ padding-left: 25px; }
.l30{ padding-left: 30px; }

.tb3{ padding-top: 3px; padding-bottom: 3px; }
.tb5{ padding-top: 5px; padding-bottom: 5px; }
.tb7{ padding-top: 7px; padding-bottom: 7px; }
.tb10{ padding-top: 10px; padding-bottom: 10px; }
.tb15{ padding-top: 15px; padding-bottom: 15px; }
.tb20{ padding-top: 20px; padding-bottom: 20px; }
.tb25{ padding-top: 25px; padding-bottom: 25px; }
.tb30{ padding-top: 30px; padding-bottom: 30px; }
.tb150{ padding-top:150px; padding-bottom:150px; }

.lr3{ padding-left: 3px; padding-right: 3px; }
.lr5{ padding-left: 5px; padding-right: 5px; }
.lr7{ padding-left: 7px; padding-right: 7px; }
.lr10{ padding-left: 10px; padding-right: 10px; }
.lr15{ padding-left: 15px; padding-right: 15px; }
.lr20{ padding-left: 20px; padding-right: 20px; }
.lr25{ padding-left: 25px; padding-right: 25px; }
.lr30{ padding-left: 30px; padding-right: 30px; }

.m0 { margin: 0; }

.mt0{ margin-top: 0px; }
.mt3{ margin-top: 3px; }
.mt5{ margin-top: 5px; }
.mt7{ margin-top: 7px; }
.mt10{ margin-top: 10px; }
.mt15{ margin-top: 15px; }
.mt20{ margin-top: 20px; }
.mt25{ margin-top: 25px; }
.mt30{ margin-top: 30px; }
.mt35{ margin-top: 35px; }
.mt40{ margin-top: 40px; }
.mt50{ margin-top: 50px; }
.mt60{ margin-top: 60px; }
.mt70{ margin-top: 70px; }
.mt80{ margin-top: 80px; }
.mt100{ margin-top: 100px; }
.mt150{ margin-top: 150px; }

.mt-10{ margin-top: -10px; }
.mt-20{ margin-top: -20px; }
.mt-30{ margin-top: -30px; }
.mt-40{ margin-top: -40px; }
.mt-50{ margin-top: -50px; }

.mr0{ margin-right: 0px; }
.mr3{ margin-right: 3px; }
.mr5{ margin-right: 5px; }
.mr10{ margin-right: 10px; }
.mr15{ margin-right: 15px; }
.mr20 { margin-right: 20px;}
.mr176 { margin-right: 176px;}

.mb0{ margin-bottom: 0px; }
.mb3{ margin-bottom: 3px; }
.mb5{ margin-bottom: 5px; }
.mb7{ margin-bottom: 7px; }
.mb10{ margin-bottom: 10px; }
.mb15{ margin-bottom: 15px; }
.mb20{ margin-bottom: 20px; }
.mb25{ margin-bottom: 25px; }
.mb30{ margin-bottom: 30px; }
.mb40{ margin-bottom: 40px; }
.mb50{ margin-bottom: 50px; }
.mb60{ margin-bottom: 60px; }
.mb80{ margin-bottom: 80px; }
.mb90{ margin-bottom: 90px; }
.mb100{ margin-bottom: 100px; }

.ml5{ margin-left: 5px; }
.ml10{ margin-left: 10px; }
.ml15{ margin-left: 15px; }
.ml20{ margin-left: 20px; }
.ml30{ margin-left: 30px; }
.ml40{ margin-left: 40px; }
.ml130{ margin-left: 130px; }


/* 横幅設定 */
.w10p{ width: 10%; }
.w15p{ width: 15%; }
.w20p{ width: 20%; }
.w25p{ width: 25%; }
.w30p{ width: 30%; }
.w35p{ width: 35%; }
.w40p{ width: 40%; }
.w50p{ width: 50%; }
.w60p{ width: 60%; }
.w80p{ width: 80%; }
.w90p{ width: 90%; }
.w95p{ width: 95%; }
.w98p{ width: 98%; }
.w100p{ width: 100%; }

.w50{ width:50px; }
.w60{ width:60px; }
.w70{ width:70px; }
.w80{ width:80px; }
.w90{ width:90px; }
.w105{ width:105px; }
.w100{ width:100px; }
.w110{ width: 110px; }
.w120{ width: 120px; }
.w150{ width: 150px; }
.w160{ width: 160px; }
.w180{ width: 180px; }
.w200{ width: 200px; }
.w220{ width: 220px; }
.w230{ width: 230px; }
.w280{ width: 280px; }
.w416{ width: 416px; }
.w473{ width: 473px; }
.w100{ width: 100px; }
.w150{ width: 150px; }
.w200{ width: 200px; }
.w210{ width: 210px; }
.w230{ width: 230px; }
.w250{ width: 250px; }
.w270{ width: 270px; }
.w300{ width: 300px; }
.w340{ width: 340px; }
.w350{ width: 350px; }
.w400{ width: 400px; }
.w450{ width: 450px; }
.w500{ width: 500px; }
.w550{ width: 550px; }
.w600{ width: 600px; }
.w650{ width: 650px; }
.w700{ width: 700px; }
.w750{ width: 750px; }
.w800{ width: 800px; }
.w850{ width: 850px; }
.w900{ width: 900px; }
.w950{ width: 950px; }
.w1000{ width: 1000px; }
.w1050{ width: 1050px; }
.w1200{ width: 1200px; }


/* 高さ設定 */
.h18{ height:18px; }
.h40{ height:40px; }
.h50{ height:50px; }
.h100{ height:100px; }
.h120{ height:120px; }
.h130{ height:130px; }
.h220{ height:220px; }
.h150{ height:150px; }
.h470{ height:470px; }


/* 回り込み解除 */
.clear{	clear: both; }

/* clearfix 2016年版 */
.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}


/* はみ出した内容の表示方法 */
.overflow_hidden{ overflow:hidden; }
.overflow_scroll{ overflow:scroll; }

/* box-sizing */
.bs_bb {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

/* 要素の表示形式 */
.none {display: none; }
.block {display: block; }
.inline {display: inline; }


/* カーソルの表示 */
.pointer { cursor: pointer; }

.pointer_btn { cursor: pointer; }
.pointer_btn:hover { opacity: 0.8; }

/* hover時opacity */
.hover_op08:hover { opacity: 0.8; }

/* 角丸 */
.radius3 {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  -o-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
}
.radius5 {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -o-border-radius: 5px;
  -ms-border-radius: 5px;
  border-radius: 5px;
}
.radius10 {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -o-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
}

/* flex設定 */
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }

.flex-end {
  -webkit-justify-content: flex-end; /* Safari */
  justify-content:         flex-end;
}

.flex1 { flex: 1; }

/* インデント設定 */
.indent {
    padding-left: 1em;
    text-indent: -1em;
}
.indent2 {
    padding-left: 2em;
    text-indent: -2em;
}
.indent3 {
    padding-left: 3em;
    text-indent: -3em;
}
.indent4 {
    padding-left: 4em;
    text-indent: -4em;
}
.indent5 {
    padding-left: 5em;
    text-indent: -5em;
}

/* エラー内容表示 */
.error_area {
	padding: 10px;
	background:#FFE6E6;
	color:#D90000;
	border: solid 1px #D90000;
	text-align: center;
	width: 80%;
	max-width: 750px;
	margin: 10px auto;
}

.error_frame {
	padding: 10px;
	background:#FFE6E6;
	border: solid 1px #D90000;
	width: 100%;
	
}



/* エラー文言表示 */
.error {
    color: #f00;
}

/* 更新内容表示 */
.update_area {
	padding: 10px;
	background:#EFE;
	color: #00D200;
	border: solid 1px #00D200;
	text-align: center;
	width: 80%;
	/*max-width: 750px;*/
	margin: 10px auto;
}


/* 必須マーク */
.require:after {
	content: " *";
	color: red;
}

/* ヘルプアイコン */
.help-icon {
    cursor: pointer;
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    /*font-size: inherit;*/
    font-size: 18px;
    text-rendering: auto;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.help-icon:before {
    content: "\f059";
}

/* 入力項目などの補足説明 */
.input_remark {
	font-size: 15px;
	color: #808080;
}

/* コンテンツサイズ */
.box_w100p {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}
.box_w100 {
	width: 100px;
	margin-right: auto;
	margin-left: auto;
}
.box_w150 {
	width: 150px;
	margin-right: auto;
	margin-left: auto;
}
.box_w200 {
	width: 200px;
	margin-right: auto;
	margin-left: auto;
}
.box_w250 {
	width: 250px;
	margin-right: auto;
	margin-left: auto;
}
.box_w300 {
	width: 300px;
	margin-right: auto;
	margin-left: auto;
}
.box_w350 {
	width: 350px;
	margin-right: auto;
	margin-left: auto;
}
.box_w400 {
	width: 400px;
	margin-right: auto;
	margin-left: auto;
}
.box_w450 {
	width: 450px;
	margin-right: auto;
	margin-left: auto;
}
.box_w500 {
	width: 500px;
	margin-right: auto;
	margin-left: auto;
}
.box_w550 {
	width: 550px;
	margin-right: auto;
	margin-left: auto;
}
.box_w600 {
	width: 600px;
	margin-right: auto;
	margin-left: auto;
}
.box_w650 {
	width: 650px;
	margin-right: auto;
	margin-left: auto;
}
.box_w700 {
	width: 700px;
	margin-right: auto;
	margin-left: auto;
}
.box_w750 {
	width: 750px;
	margin-right: auto;
	margin-left: auto;
}
.box_w800 {
	width: 800px;
	margin-right: auto;
	margin-left: auto;
}
.box_w850 {
	width: 850px;
	margin-right: auto;
	margin-left: auto;
}
.box_w900 {
	width: 900px;
	margin-right: auto;
	margin-left: auto;
}
.box_w950 {
	width: 950px;
	margin-right: auto;
	margin-left: auto;
}
.box_w1000 {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
}
.box_w1200 {
    width: 1200px;
    margin-right: auto;
    margin-left: auto;
}
.box_w1400 {
    width: 1400px;
    margin-right: auto;
    margin-left: auto;
}
.box_w1600 {
    width: 1600px;
    margin-right: auto;
    margin-left: auto;
}

.pc-disp {
    display: block;
}
.sp-disp {
    display: none;
}

/* スマホ */
@media (max-width: 599px) {
    .pc-disp {
        display: none;
    }
    .sp-disp {
        display: block;
    }
}