@charset "utf-8";
/* CSS Document */

/* basic elements
------------------------------------------------*/

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html{
/*   overflow-y: scroll;*/
	font-size: 0.625em;
}

body {
	font-family: 'Lucida Grande',  Meiryo, メイリオ, sans-serif;
	color: #000;
	-webkit-text-size-adjust: 100%;
}

article, aside, figure, figcaption, footer, header, nav, section {
	display: block;
}

h1,h2,h3,h4,h5,h6 {font-weight: bold;}

a:link,
a:visited,
a:active,
a:hover {
	outline: none;
}
hr     {display: none;}
img    {border: none; vertical-align: bottom;}
strong {font-weight: bold;}
em     {font-style: normal;}
small  {font-size: 0.8em;}
big    {font-size: 1.3em;}

img { 
	max-width: 100%;
}
.cap  {font-size: 0.8em !important;}

/* pkg
------------------------------------------------*/

.pkg:after
{
	content: ""; 
	display: block; 
	clear: both;
}
* html .pkg {display: inline-block;}
.pkg { 
	display: block;
	min-height: 0;
}

/* 元スタイル引き継ぎ
------------------------------------------------*/
.btn-primary {
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
}
.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    border: 1px solid transparent;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: transparent;
    white-space: nowrap;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.form-control {
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.form-group.required .control-label:before {
    content: "*";
    color: red;
    font-size: 20px;
}
.nav {
    list-style: none;
}
.navbar-default .navbar-nav > li > a, .navbar-default .navbar-text {
    color: #777;
}
.navbar-nav > li > a {
    padding-top: 15px;
    padding-bottom: 15px;
}
.navbar-nav > li > a {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px;
}
.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid\9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
    background-color: #e7e7e7;
    color: #555;
}
.navbar-default .navbar-nav > li > a, .navbar-default .navbar-text {
    color: #777;
}
.nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
    background-color: #eee;
    border-color: #337ab7;
}
.nav > li, .nav > li > a {
    display: block;
    position: relative;
}
.navbar-nav > li > .dropdown-menu {
    margin-top: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}
.navbar-right .dropdown-menu {
    right: 0;
    left: auto;
}
.open > .dropdown-menu {
    display: block;
}
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
        margin-top: 2px;
    list-style: none;
    font-size: 14px;
    text-align: left;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    background-clip: padding-box;
}
/* 
------------------------------------------------*/
body {
	background: #ff8cbf url(/uploads/images/2117/image_2117_1605838655.png);
	background-size: 40px 40px;
}

.panel-body.panel-body-page.h-adr .panel-heading h3:first-child  {
	display: none;
}

/* 最上部のロゴ・ログアウトボタン
------------------------------------------------*/
nav.navbar.navbar-default.navbar-static-top {
	width: 100%;
	background: #ff3289;
	padding: 10px;
	height: 62px;
}
nav.navbar .container {
	position: relative;
}

nav #app-navbar-collapse {
	position: absolute;
	right: 20px;
	top: 10px;
}

/* 一番外側の大枠
------------------------------------------------*/
body > .container {
	margin: auto;
	padding-top: 10px;
	color: #5f052c;
}

/* フッター
------------------------------------------------*/
footer.footer {
	position: relative;
	padding: 10px 0;
	width: 100%;
	background: #ff3289;
	text-align: center;
	color: #fff;
	font-size: 1.2em;
}
footer.footer .container {
	margin: 10px auto 0;
}

footer.footer a {
	position: absolute;
	right: 20px;
	top: -12px;
	width: 227px;
	height: 33px;
	background-image: url(/uploads/images/213/image_213_1516278096.png);
	background-size: contain;
	display: block;
	text-indent: -9999px;
}

/* アラーと
------------------------------------------------*/
body > .container .alert {
	border: 1px solid transparent;
	font-size: 12px;
	border: 1px solid ;
	padding: 8px 12px;
}
body > .container .alert ul {
	padding-left: 1.4em;
}
.alert-danger {
	background-color: #f2dede;
	border-color: #ebccd1;
	color: #a94442;
}

/* 共通ボックス
------------------------------------------------*/
.panel-body {
	font-size: 16px;
	padding: 6px 0;
	margin-bottom: 10px;
}

button {
	font-size: 18px !important;
	padding: 8px 30px !important;
}

.kei {
	border-bottom: 4px dotted #7fe18e !important;
	padding-bottom: 16px !important;
	margin-bottom: 10px !important;
}

/*
ページタイトル
画像によってPC/spともに適宜サイズ指定すべし
------------------------------------------------*/
#form_title {
	background-image: url(/uploads/images/2118/image_2118_1605838663.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	text-indent: -9999px;
}

form .panel-heading.panel-heading-page {
	display: none;
}

.form-horizontal {
	background-color: #fff;
	border-radius: 16px;
}

/* フォーム
------------------------------------------------*/
input[type="text"] {
	border-radius: 3px;
	padding: 3px;
}
.tx1 input { width: 4em }
.tx2 input { width: 10em; max-width: 100%; }
.tx3 input { width: 20em; max-width: 100%; }
.tx4 input { width: 100%; }

.txa1 textarea { width: 100%; height: 5em; }
.txa2 textarea { width: 100%; height: 10em; }

.pi {
	margin-bottom: 2px !important;
}

.pi label {
	font-size: 16px;
}

.form-group input,
.form-group select,
.form-group textarea {
	font-size: 16px;
}
.panel-heading {
	font-size: 16px;
}
.panel-heading.panel-heading-section > h3 {
	background: #ffc600;
	color: #fff;
	border-radius: 30px;
	font-size: 22px;
	padding: 4px 20px 0;
	margin-bottom: 8px;
}
.q {
	margin: 0;
}
.q.panel-body.panel-body-section p {
	color: #ff3384;
	font-weight: bold;
	font-size: 18px;
}

select.form-control {
	width: auto;
	max-width: 100%;
}

input[type="checkbox"], input[type="radio"] {
	margin: 2px !important;
}
.checkbox,
.radio {
	border-collapse: collapse;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:-webkit-flexbox;
	display:-moz-flexbox;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
	vertical-align: top;
	width: 100%;
	list-style-type: none;
}

.pin{
	text-align: center;
}

@media screen and (max-width:768px) {
	#form_title {
		height: 50vw;
		max-height: 200px;
	}

	body > .container {
		width: 100%;
		padding: 82px 10px 0;
	}
	footer .container {
		padding: 0 10px;
	}

	.form-horizontal {
		border: 2px solid #84e994;
		padding: 12px 9px;
	}
	footer.footer .toppage a {
		right: 10px;
	}
	.col2 label,
	.col3 label,
	.col4 label {
		width: 50%;
	}
	.checkbox label,
	.radio label {
		padding: 8px 0;
	}
}
@media screen and (max-width:480px) {
	.panel-heading.panel-heading-section > h3 {
		border-radius: 3px;
		padding: 10px;
	}
	.col2 label,
	.col3 label,
	.col4 label {
		width: 100%;
	}
}

@media screen and (min-width:769px) {
	#form_title {
		height: 200px;
		margin-bottom: 12px;
	}

	body > .container,
	footer .container {
		width: 900px;
	}

	.form-horizontal {
		border: 5px solid #1cbe88;
		padding: 14px 24px;
	}


	.pi:after {
		content: ""; 
		display: block; 
		clear: both;
	}
	.pi label.left-label {
		float: left;
		width: 9em;
	}
	.pi > .form-group {
		width: 100%;
	}
	.pi > div > div {
		float: left;
		width: calc(100% - 10em);
	}

	.checkbox label,
	.radio label {
		padding: 3px 0;
	}

	.col2 label {
		width: 50%;
	}
	.col3 label {
		width: calc(100% / 3);
	}
	.col4 label {
		width: 25%;
	}
}
