@charset "UTF-8";


.all_closed span.btn{
	cursor: pointer;
	font-size: .85rem;
	line-height: 100%;
	padding: .7rem 2rem;
	display: block;
	text-align: center;
	border-radius: 5px;
	transition: .3s;
	color: #fff;
	background: rgb(174,68,62);
	background: -moz-linear-gradient(top,  rgba(174,68,62,1) 0%, rgba(145,38,33,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(174,68,62,1) 0%,rgba(145,38,33,1) 100%);
	background: linear-gradient(to bottom,  rgba(174,68,62,1) 0%,rgba(145,38,33,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ae443e', endColorstr='#912621',GradientType=0 );
}

.all_closed span:after{
	content: "＋";
	margin-left: 3px;
}

.all_opened span.btn{
	cursor: pointer;
	font-size: .85rem;
	line-height: 100%;
	padding: .7rem 2rem;
	display: block;
	text-align: center;
	border-radius: 5px;
	transition: .3s;
	color: #fff;
	background: rgb(187,187,187);
	background: -moz-linear-gradient(top,  rgba(187,187,187,1) 0%, rgba(153,153,153,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(187,187,187,1) 0%,rgba(153,153,153,1) 100%);
	background: linear-gradient(to bottom,  rgba(187,187,187,1) 0%,rgba(153,153,153,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bbbbbb', endColorstr='#999999',GradientType=0 );
}

.all_opened span:after{
	content: "ー";
	margin-left: 3px;
}

.closed span:after{
	position: absolute;
	top: 50%;
	right: 10px;
	content: '＋';
	font-size: .8rem;
	margin-top: -0.7rem;
	color: #874d4a;
	font-weight: bold;
}

.opened span:after{
	position: absolute;
	top: 50%;
	right: 10px;
	content: "ー";
	font-size: .8rem;
	margin-top: -0.7rem;
	color: #874d4a;
	font-weight: bold;
}


.tranlate-module__parag--selected {
    display: block !important;
}

.tranlate-module__parag {
    display: none;
}

.modal_confirmbox{
	max-height: 400px;
	width: 100%;
	overflow: scroll;
	margin-bottom: 25px;
}

.modal_listbox{
	height: auto;
	max-height: 400px;
	width: 100%;
	overflow-y: scroll;
	margin-bottom: 25px;
}

#modal-wrap {
	position: relative;
	margin:10px auto;
	background: #fff;
	padding: 30px;
	border-radius: 5px;
}

.w700 {
	max-width: 700px;
}

.w1000 {
	max-width: 1000px;
}

#modal-wrap h2 {
	font-weight: bold;
	font-size: 1.2rem;
	margin: 0 0 20px;
}

#modal-wrap ul {
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

#modal-wrap ul li {
	border-bottom: 1px solid #ccc;
	padding: 5px 8px;
	font-size: .85rem;
}

#modal-wrap ul li.head {
	background: #912822;
	color: #fff;
}

#modal-wrap table.photo {
   border-collapse: collapse;
   border:1px solid #ccc;
	width: 100%;
	font-size: .85rem;
}

#modal-wrap table.photo th {
   border-collapse: collapse;
	border:1px solid #ccc;
	padding: 10px;
	background: #912822;
	color: #fff;
}

#modal-wrap table.photo th:first-child {
	min-width: 100px;
}

#modal-wrap table.photo th:nth-child(2) {
	min-width: 350px;
}

#modal-wrap table.photo td {
   border-collapse: collapse;
	border:1px solid #ccc;
	padding: 10px;
}

#modal-wrap table.photo td div {
	float: left;
	font-size: .8rem;
	text-align: center;
	margin-right: 10px;
}

#modal-wrap table.photo td div:nth-child(3n+1) {
	clear: both;
}

#modal-wrap table.photo td div img {
	width: 100px;
	display: block;
}

#modal-wrap table.code {
   border-collapse: collapse;
   border:1px solid #ccc;
	width: 100%;
	font-size: .8rem;
}

#modal-wrap table.code th {
   border-collapse: collapse;
	border:1px solid #ccc;
	padding: 5px;
	background: #912822;
	color: #fff;
	text-align: center;
}

#modal-wrap table.code td {
   border-collapse: collapse;
	border:1px solid #ccc;
	padding: 5px;
	word-break: break-all;
	width: 80px;
	min-width: 80px;
	table-layout: fixed;
}

#modal-wrap .modal_dl {
	text-align: center;
}

#modal-wrap .modal_dl p {
	padding-bottom: 10px;
}

#modal-wrap .modal_dl p.size {
	color: #912822;
}

#modal-wrap .modal_dl p.size span {
	display: block;
	font-size: 1.7rem;
	padding-bottom: 10px;
	font-weight: bold;
}

#modal-wrap .modal_btn {
	text-align: center;
	margin-top: 25px;
}

#modal-wrap .modal_btn a {
	display: inline-block;
	margin: 5px;
	text-align: center;
	width: 200px;
	background: #902721;
	color: #fff;
	padding: 10px 0;
}

#modal-wrap .modal_btn a:hover {
	text-decoration: none;
}

#modal-wrap .modal_btn a.download:before {
	content: "\f019";
	font-family: FontAwesome;
	padding-right: 5px;
	font-size: 1.5rem;
	vertical-align: -3px;
}

#modal-wrap .modal_btn a.dismiss {
	background: #ccc;
}

#modal-wrap .modal_btn a.dismiss:before {
	content: "\f00d";
	font-family: FontAwesome;
	padding-right: 5px;
	font-size: 1.5rem;
	vertical-align: -3px;
}

#modal-wrap .dismiss {
	text-align: center;
}

#dl .frame{
	overflow:hidden;
	background: #fff;
	padding: 20px;
	border: 1px solid #ccc;
	margin-bottom:20px;
}

#dl .list_frame{
margin-top: 20px;
	position: relative;
	overflow: hidden;
    display:-webkit-box;
    display:-moz-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-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;
		z-index: 0;
}

#dl .list_frame:before{
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	margin-left: -12px;
	width: 10px;
	height: 10px;
 	content:'▶';
	color: #902721;
	font-size: 2rem;
	z-index: -1;
}

#dl .nobg:before{
 	content:'';
}

#dl .list_frame h2 {
	font-size: 1.2rem;
	font-weight: bold;
}

#dl .list_frame h2 span{
	display: inline-block;
	line-height: 100%;
	padding: 14px 16px;
	margin-right: 10px;
	color: #fff;
	font-size: 1.5rem;
	border-radius: 5px;
	background: rgb(174,68,62);
	background: -moz-linear-gradient(top,  rgba(174,68,62,1) 0%, rgba(145,38,33,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(174,68,62,1) 0%,rgba(145,38,33,1) 100%);
	background: linear-gradient(to bottom,  rgba(174,68,62,1) 0%,rgba(145,38,33,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ae443e', endColorstr='#912621',GradientType=0 );
}

#dl .list_frame .left{
	width: 47%;
}

#dl .confirm_btn {
	text-align: center;
	margin: 0 auto;
}

#dl .confirm_btn a {
	background: #902721;
	display: block;
	width: 200px;
	text-align: center;
	color: #fff;
	padding: 10px 0;
	margin: 25px auto 0;
	transition: .4s;
	border: 1px solid #902721;
}

#dl .confirm_btn a:hover {
	background: #fff;
	color: #902721;
	text-decoration: none;
}

#dl .list_frame .right{
	width: 47%;
	margin-left: 6%;
}

#dl .list_frame .select,
#dl .list_frame .result,
#dl .list_frame .item {
	padding: 10px;
	border: 2px solid #912822;
	border-radius: 5px;
	margin-top: 10px;
	box-sizing: border-box;
	width: 100%;
}

#dl .list_frame .select .btnarea {
	overflow: hidden;
	height: auto;
}

#dl .list_frame .select .btnarea .check {
	float: left;
}

#dl .list_frame .select .btnarea .check label {
	cursor: pointer;
	border: 1px solid #ccc;
	font-size: .8rem;
	line-height: 100%;
	padding: .5rem;
	display: block;
	text-align: center;
	border-radius: 5px;
	color: #0066cc;
}

#dl .list_frame .item .btnarea .check label {
	cursor: pointer;
	border: 1px solid #ccc;
	font-size: .8rem;
	line-height: 100%;
	padding: .5rem;
	display: block;
	text-align: center;
	border-radius: 5px;
	color: #0066cc;
	width: 130px;
}

#dl .list_frame .btnarea .check input {
	vertical-align: -2px;
	margin-right: 4px;
}

#dl .list_frame .item .mainarea {
	text-decoration: none;
	border: 1px solid #ccc;
	margin-top: 10px;
	height: 400px;
	overflow-y: scroll;
}

#dl .list_frame .item .mainarea li {
	display: block;
	position: relative;
	padding: 4px 10px;
	font-size: .85rem;
	background: #fff;
}

#dl .list_frame .select .btnarea .btn {
	float: right;
}

#dl .list_frame .select .btnarea .btn:hover {
	text-decoration: none;
	opacity: .7;
}

#dl .list_frame .select .mainarea {
	text-decoration: none;
	border: 1px solid #ccc;
	margin-top: 10px;
	height: 400px;
	overflow-y: scroll;
}

#dl .list_frame .select .photo {
	text-decoration: none;
	border: 1px solid #ccc;
	margin-top: 10px;
	height: 562px;
	overflow-y: scroll;
}

#dl .list_frame .select .mainarea .head {
	padding: 10px 0 5px;
}

#dl .list_frame .select .mainarea .head .check {
	overflow: hidden;
}

#dl .list_frame .select .mainarea .head p {
	display: inline-block;
	float: left;
	margin-right: 10px;
	color: #333;
	font-size: .9rem;
	line-height: 36px;
}

#dl .list_frame .select .mainarea .head .check label {
	cursor: pointer;
	border: 1px solid #ccc;
	font-size: .8rem;
	line-height: 100%;
	padding: .5rem;
	display: inline-block;
	text-align: center;
	border-radius: 5px;
	color: #0066cc;
	float: left;
}

#dl .list_frame .select .mainarea .box {
	overflow: hidden;
	display: table;
	table-layout: fixed;
	width: 100%;
	padding: 0;
}

#dl .list_frame .select .mainarea .box label {
	border: 1px solid #ccc;
	padding: 5px;
	width: 16%;
	float: left;
	text-align: center;
	margin-right: .75%;
	margin-top:5px;
	margin-bottom:5px;
	font-size: .8rem;
	cursor: default;
}

#dl .list_frame .select .mainarea .box label span {
	cursor: pointer;
}

#dl .list_frame .select .mainarea .box label input {
	cursor: pointer;
}

#dl .list_frame .select .mainarea .box label a:hover {
	color: #0066cc;
	text-decoration: none;
}

#dl .list_frame .select .mainarea .box label:nth-child(6n){
	margin-right: 0;
}

#dl .list_frame .select .mainarea .box label:nth-child(6n+1){
	clear: both;
}

#dl .list_frame .select .mainarea .box label img{
	display: block;
	max-width: 100%;
	width: auto;
	margin: 0 auto 10px;
}

#dl .list_frame .select .mainarea .toggle {
	display: block;
	position: relative;
	cursor: pointer;
	padding: 5px 10px;
	font-size: .9rem;
	background: #efe6e5;
	border-bottom: 1px solid #ccc;
	color: #333;
}

#dl .list_frame .select .mainarea .toggle:hover {
	text-decoration: none;
}

#dl .list_frame .select .mainarea li label {
	display: block;
	cursor: pointer;
	position: relative;
	padding-left: 18px;
}
#dl .list_frame .select .mainarea li label input {
	vertical-align: -2px;
	position: absolute;
	left: 0;
	top: 2px;
}
#dl .nobg .select .mainarea li label input {
	vertical-align: 0px;
	position: relative;
	left: 0;
	top: 0;
}
#dl .list_frame .select .mainarea li {
	display: block;
	position: relative;
	padding: 4px 10px;
	font-size: .8rem;
	background: #fff;
	border-bottom: 1px solid #ccc;
	color: #0066cc;
}

#dl .list_frame .result .title {
	overflow: hidden;
	height: 36px;
	text-align: center;
	color: #902722;
	font-size: 1.5rem;
	padding-top: 7px;
}

#dl .list_frame .result .mainarea {
	text-decoration: none;
	border: 1px solid #ccc;
	margin-top: 10px;
	height: 400px;
	overflow-y: scroll;
	padding: 10px;
}

#dl .list_frame .result .mainarea li {
	font-size: .9rem;
	padding-bottom: 5px;
}

@media only screen and (max-width: 1080px) {

}


@media only screen and (max-width: 980px) {

#dl .list_frame .left{
	width: 100%;
	margin-bottom: 0;
}

#dl .list_frame .right{
	width: 100%;
	margin-left: 0;
	margin-top: 20px;
}

#dl .list_frame:before{
	/*
 	content:'\f078';
	*/
 	content:'';
}

#dl .list_frame .select .btnarea {
	height: auto;
}

}


@media only screen and (max-width: 640px) {

#dl .list_frame .select .mainarea .box label{
	width: 32%;
	margin-right: 2%;
}

#dl .list_frame .select .mainarea .box label:nth-child(3n){
	margin-right: 0;
}

#dl .list_frame .select .mainarea .box label:nth-child(3n+1){
	clear: both;
}

}


@media only screen and (max-width: 480px) {

#dl .list_frame .right{
	margin-top: 20px;
}

#dl .list_frame:before{
 	content:'';
}

#modal-wrap table.photo {
	font-size: .8rem;
}

#modal-wrap table.photo th {
   border-collapse: collapse;
	border:1px solid #ccc;
	padding: 5px;
	background: #912822;
	color: #fff;
}

#modal-wrap table.photo td {
	padding: 5px;
	margin-right: 0;
}

#modal-wrap table.photo td div {
	float: left;
	font-size: .8rem;
	text-align: center;
	margin-right: 10px;
}

#modal-wrap table.photo th:first-child {
	width: 80px;
}

#dl .list_frame .select .btnarea .btn {
	float: none;
	margin-top: 10px;
}

#dl .list_frame .select .btnarea .check {
	float: none;
}

#dl .list_frame .select .mainarea .head p {
	float: none;
}

#dl .list_frame .select .mainarea .head .check label {
	float: none;
	width: 100%;
}

#dl .list_frame .select .mainarea .box label{
	padding: 5px;
	width: 32%;
}

#dl .list_frame .item .btnarea .check label {
	width: 100%;
}

}


@media only screen and (max-width: 375px) {

}