@charset "utf-8";


/* ----------------------------------------------
     共通
---------------------------------------------- */

html{
     height:100%;
     font-size:10px;     /* 1rem = 10px */
	background : #fff;
}
body{
     height:100%;
     font-size:16px;
     font-size:1.6rem;
	background : #fff;
	color : #231815;
     line-height:1;
	 font-family:'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, "Arimo", sans-serif;
	 font-weight: 100;
}

a{
     color:#641344;
     text-decoration:none;
     transition: background-color 1s;
}

a.-inner{
	color: #641344;
	text-decoration: underline;
}

a:hover{
     opacity: 0.7;
}

button,input,textarea{
     font-family: "Noto Sans JP", "游ゴシック", YuGothic, "メイリオ", Meiryo, "Arimo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
/*     font-family:"Arimo", "メイリオ", Meiryo, sans-serif;*/
}

/* -------------------------------------
     clearfix
---------------------------------------- */
/* .cf:before,.cf:after,
div:before,div:after,
dl:before,dl:after,
nav:before,nav:after,
section:before,section:after,
header:before,header:after,
footer:before,footer:after,
ul:before,ul:after{
     content:"";
     display:table;
}
.cf:after,
nav:after,section:after,
header:after,footer:after,
ul:after,dl:after,div:after {
     clear:both;
}

.cf,
section,header,footer,nav,
dl,ul,div {
     zoom:1;
} */

/* -------------------------------------
     html body
---------------------------------------- */
html,
body {
	width : 100%;
}


@media screen and (max-width: 767px) {
	img {
		max-width : 100%;
	}
}


/*PC*/
@media screen and (min-width: 768px) {
	.sp_only {
		display : none;
	}
.event_consent.sp_only  {
	display : none;
}
}

/*SP*/
@media screen and (max-width: 768px) {

	.pc_only {
		display : none;
	}
}

.ellipsis {
	display : inline-block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* -------------------------------------
      骨組み
---------------------------------------- */

.container {
	width : 100%;
	position : relative;
}


.to_top {
	position : fixed;
	bottom : 0;
	right : 30px;
	width : 5%;
	max-width : 46px;
	min-width : 40px;
}





/* -------------------------------------
      form
---------------------------------------- */
input[type=text],
input[type=date],
input[type=time],
input[type=password],
textarea,select {
	display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: .375rem .75rem;
    line-height: 1.5;
    background-clip: padding-box;
    border: 1px solid;
    background-color: #fff;
    border-color: #d7d7d7;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
::placeholder {
	color: #d7d7d7;
  }
input[type=time]{
	width: 6em;
}

textarea {
	height : 10em;
}
textarea.multi_text {
	height : 4em;
}



.field_input_col2 {
	display: flex;
	justify-content: space-between;
}
.field_input_col2 .field_input {
	width: 48%;
}

.field_input {
	margin-bottom: 1rem;
}
.field_title {
	margin-bottom: 0.5rem;
	display: block !important;
	font-size:80%;
}


.inline_area input[type=text],
.inline_area input[type=date],
.inline_area input[type=time],
.inline_area input[type=password],
.inline_area textarea,
.inline_area select {
	display:inline-block;
}


/* -------------------------------------
      common
---------------------------------------- */

.-mb5{
	margin-bottom : 0.5rem !important;
}
.-mb10{
	margin-bottom : 1rem !important;
}
.-mb20{
	margin-bottom : 2.0rem !important;
}

.-mt5{
	margin-top : 0.5rem !important;
}
.-mt10{
	margin-top : 1rem !important;
}
.-mt20{
	margin-top : 2.0rem !important;
}

.-tac {
	text-align: center;
}

.message_section {
	margin-bottom : 1.6rem;
}

.message {
	position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    margin-top: 1rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
}
.message_inline {
	font-size : 1.4rem;
    padding: .5rem .75rem;
}

.success {
    color: #18603a;
    background-color: #d5f1de;
    border-color: #c4ebd1;
}
.error {
	color: #772b35;
    background-color: #fadddd;
    border-color: #f8cfcf;
}

label {
	margin-bottom: 1em;
	display: inline-block;
}

 label:not(:last-child) {
	margin-right: 1em;
	display: inline-block;
}
.inner_list label {
	margin-bottom : 0;
}
.inner_flex {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.__time {
	width: 6.5em;
}

.__one_line {
	vertical-align: middle;
}

.__field_title {
	width: 8em;
	text-align: left;
	font-weight: 400;
	flex-shrink: 0;
}
.__field_input {
	width: 100%;
	text-align: left;
}


.__separator {
	width: 2em;
	text-align: center;
	align-self: center;
}
.__multi_text {
	height: 4em;
}

.__input_note {
	line-height: 1.6;
	font-size: 90%;
}

.btn_section {
	display: flex;
	justify-content: space-around;
	padding : 4.8rem 0 3.2rem 0;
}
.btn_section_80 {
	width: 80%;
	margin : 4.8rem auto 3.2rem;
}

.btn_section_block {
	margin-top:4.8rem;
	padding-top: 2.4rem;
	width: 80%;
	margin : 1.6rem auto 1.6rem;
	border : 1px solid #d7d7d7;
	border-radius:6px;
	align-items: center;
}
.btn_section_border {
	margin-top:4.8rem;
	padding-top: 4.8rem;
	width: 80%;
	margin : 4.8rem auto 3.2rem;
	border-top : 1px solid #d7d7d7;
}
.btn_section_left {
	justify-content: flex-start;
	padding : 0rem 0;
}

.base_btn {
	background : #333;
	color:#fff;
	padding : 0.5rem 1.6rem;
	border-radius: 0.5rem;
	cursor: pointer;
}

.base_btn_register {
	padding : 1rem 3rem;
	border-radius: 0.5rem;
	font-size : 2rem;
	background-color: #b40014;
}

.base_btn_temp {
	padding : 1rem 3rem;
	border-radius: 0.5rem;
	font-size : 2rem;
}

.base_btn_next {
	padding : 1rem 3rem;
	border-radius: 0.5rem;
	font-size : 2rem;
}
.base_btn_next:after {
	content : "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight: 700;
	position: relative;
	display: inline-block;
	margin-left:1em;
}


.base_btn_prev {
	padding : 1rem 3rem;
	border-radius: 0.5rem;
	font-size : 2rem;
	line-height: normal;
	font-weight: normal;
}
.base_btn_prev:before {
	content : "\f053";
	font-family: "Font Awesome 5 Free";
	font-weight: 700;
	position: relative;
	display: inline-block;
	margin-right:1em;
}

.add_btn {
	background : #333;
}

.base_btn:hover{
	opacity: 0.7;
}

.copy_btn {
	background : rgb(102, 41, 138);
	color:#fff;
	padding : 0.5rem 0.8rem;
	border-radius: 0.5rem;
	cursor: pointer;
	display: inline-block;

}



.link_btn {
	display: inline-block;
}

/* -------------------------------------
      layout
---------------------------------------- */

.wrap {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-content: space-between;
	min-height: 100vh;
}

.wrap:before{
	display: none;
}

.container {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	flex-grow: 1;
}

header {
	margin: 0;
}

main {
	order: 1;
	width: calc(100% - 200px);
}

.sidemenu{
	order: 0;
	width: 200px;
	height: calc(100vh - 6rem);
}

/* -------------------------------------
      header
---------------------------------------- */
header {
	padding : 0 ;
	position: relative;
	width: 100%;
	margin: auto;
	height : 4.8rem;
	padding : 0 1em 0;
	border-bottom : 1px solid #d7d7d7;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.2);
	background : #fff;
	z-index: 100;
}

.header_in {
	width: 100%;
	max-width: 1260px;
	margin:auto;
	text-align: left;
	display: flex;
	justify-content: space-between;
}

.header_in:before{
	display: none;
}

.header {
	width: 90%;
	text-align: left;
	font-weight: 900;
}
.website {
		width: 5%;
		text-align: right;
}

.logout {
	width: 5%;
	text-align: right;
}

.link_underline {
	text-decoration: underline;
}

/* -------------------------------------
      footer
---------------------------------------- */

footer {
	text-align :center;
	padding : 0.5rem;
	font-size : 1.2rem;
	height : 2.4rem;
	
}


/* -------------------------------------
      nav
---------------------------------------- */
.sidemenu {
	border-bottom: none;
	box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.2);
	margin : 0 auto;
}


.sidemenu li {
	padding : 1em;
	bottom: -1px;
	position: relative;
	border-bottom : 1px solid #d7d7d7;
}

.sidemenu .current {
	font-weight: 700;

}

.submenu {
	padding : 1em;
	border-bottom : 1px solid #d7d7d7;
	display: flex;
	justify-content: space-between;

}


/* .submenu a{
	text-decoration: underline;
} */

.pipeline {
	display: inline-block;
	padding : 0 1em;
	opacity:0.4;
}

/* -------------------------------------
      contents
---------------------------------------- */

/* main {
} */

.contents {
	width:100%;
	max-width: 1260px;
	background: #fff;
	box-shadow: 1px 1px 5px 0 rgba(0, 0, 0, 0.2);
	margin : 0 auto;
	padding : 1em;
}

.login .contents {
	width:40%;
	min-width: 260px;

}

.login .container {
	-ms-flex-direction: row;
	flex-direction: row;
	align-items:center;
}

.page_title {
	border-bottom : 2px solid #d7d7d7;
	padding :  0.5em ;
	font-weight: 700;
	font-size: 2.4rem;
	margin-bottom : 2.4rem;
}

.page_sub_title {
	border-bottom : 1px solid #d7d7d7;
	padding :  0.5em ;
	font-weight: 700;
	font-size: 2.0rem;
	width:80%;
	margin: 4rem auto 2rem;
}
.page_sub_title_full {
	border-bottom : 1px solid #d7d7d7;
	padding :  0.5em ;
	font-weight: 700;
	font-size: 2.0rem;
	width:100%;
	margin: 2rem auto 2rem;
}


.table_section {
	margin-bottom : 1.6rem;
}

.base_table {
	width: 100%;
}
.base_table thead th{
	border-bottom : 2px solid #d7d7d7;
	border-top : 1px solid #d7d7d7;
	padding : 0.8em;
	font-weight: 700;
}

.base_table tbody td{
	border-bottom : 1px solid #d7d7d7;
	padding : 0.8em;

}
.base_table tbody td {
	background: #f9f9f9;
}
.base_table tbody tr:nth-child(odd) td {
	background: #fff;
}

.base_table tbody tr.no_display td{
	background : #ccc;
}


.base_table .fav{
	width: 3em;
	text-align:center;
}
.base_table .no{
	width: 4em;
	text-align:center;
}
.base_table .date{
	width: 10em;
	text-align:center;
}
.base_table .modify_date{
	width: 14em;
	text-align:center;
}
.base_table .image{
	width: 10em;
	text-align:center;
	height: 40px;
}

.base_table .picture {
	max-height : 40px;
}
.base_table .title{
	text-align:left;
}
.base_table .category{
	text-align:left;
	width: 10em;
}
.base_table .item{
	width: 8em;
}
.base_table .large{
	width: 30rem;
}

.base_table .action{
	width: 4em;
	text-align:center;
}
.base_table .sort{
	width: 6em;
	text-align:center;
}


.base_table.more_list .more_hide {
	display:none;
}
.base_table.pager_list .pager_hide {
	display:none;
}

/* -------------------------------------
      base_table sort
---------------------------------------- */

.js-sortTable .sort_col {
	cursor: pointer;
}
.js-sortTable .sort_col span {
	display: inline-block;
}

.js-sortTable .sort_col span:after {
	content: "\f0dc";
	font-family: "Font Awesome 5 Free";
	color :rgba(0, 0, 0, 0.2);
	padding-left : 0.5em;
}


.js-sortTable .sort_col span.num[data-sort=asc]:after {
	content: "\f162";
	color : #64c3ce;
}


.js-sortTable .sort_col span.num[data-sort=desc]:after {
	content: "\f886";
	color : #ce6479;
}





/* -------------------------------------
      grid_table
---------------------------------------- */

/* .grid_table {
} */

.grid_table thead {
	display: none;
}

.grid_table tbody {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	max-width: 1220px;
}

.grid_table tbody tr{
	display: flex;
	width: 20%;
	max-width:250px;
	flex-wrap: wrap;
}

.grid_table tbody td{
	display: block;
}

.grid_table tbody .fav {
	width: 20%;
	order:1;
}
.grid_table tbody .no {
	width: 60%;
	order:2;
}
.grid_table tbody .action {
	width: 20%;
	order:3;

}
.grid_table tbody .category {
	width: 100%;
	order:4;
}

.grid_table tbody .title {
	width: 100%;
	order:5;
}
.grid_table tbody .date {
	width: 100%;
	order:6;
	font-size: 1.2rem;
}
.grid_table tbody .image {
	width: 100%;
	order:7;
	flex-grow: 10;
	height: 240px;
}


.grid_table .picture {
	max-height : 190px;
	max-width: 100%;
}



/* -------------------------------------
      dashboard
---------------------------------------- */


.dashboard_area {
	display: flex;
	margin-bottom :1rem;
}

.dashboard_block{
	width:50%;
	border : 1px solid #d7d7d7;
	/* border-radius:4px; */
	overflow: hidden;
}

.dashboard_title{
	background: #d7d7d7;
	font-weight: 700;
	padding : 1rem;
}
.block01 .dashboard_title{
	background: #d7d7d7;

}


.dashboard_link {
	display: block;
	background : #ccc;
	padding : 10px;
	width:20%;
	text-align: center;
}

.dashboard_link i{
	font-size:3rem;
	margin-bottom:1rem;

}

.dash_link_title {
	/* margin-bottom : 0.5em; */
	line-height: 1.4;
}

.dashboard_detail_block {
	width: 80%;
	display: flex;
	flex-wrap: wrap;
	margin-left:1rem;
}

.dashboard_detail_link {
	border :1px solid #ccc;
	/* border-radius:10px; */
	width:20%;
	text-align: center;
	margin-right:1rem;

	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.dash_link_title {
	font-size : 1.8rem;
}
.link_note {
	font-size:1.2rem;
}

.dashboard_link_type_init{
	background: #e9f1db;
}


/* -------------------------------------
      modal inner
---------------------------------------- */
.modal_detail {
	display:flex;
	justify-content: flex-start;
	align-items: flex-start;
	margin-bottom: 1.6rem;
}

.evaluation {
	width: 10%;
	font-size: 2.4rem;
}

.modal_image img{
	max-width: 100%;
}

/* -------------------------------------
      option_section
---------------------------------------- */

.option_section {
	display: flex;
	justify-content: space-between;
	width: 100%;
	margin-bottom : 1.6rem;
}
.option_section:before,
.option_section:after {
	display : none;
}

.option {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.option p {
	margin-left : 1em;
	color : #999;
	/* cursor: pointer; */
}

.switch_link {
	color : #999;
	cursor: pointer;
}

.option .active {
	color :#231815;
	pointer-events: none;
	cursor: default;
}
.option .active:hover {
	opacity: 1;
}

/* -------------------------------------
      search_section
---------------------------------------- */
.search_section {
	border:1px solid #d7d7d7;
	padding : 1em;
	border-radius: 0.5rem;
	margin-bottom: 1.6rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.search_input_section {
	display: flex;
	width: 90%;
	flex-wrap: wrap;
}

.search_input_section_middle {
	display: flex;
	width: 70%;
	flex-wrap: wrap;
}
.search_input_section_half {
	display: flex;
	width: 48%;
	flex-wrap: wrap;
}

.search_input_section_large {
	display: flex;
	width: 80%;
	flex-wrap: wrap;
}

.search_btn_section {
	flex-shrink: 0;
	width: 17rem;
}
.search_input {
	margin-bottom: 1rem;
	margin-right: 1rem;
}
.search_input .title {
	font-weight: 700;
	margin-bottom:1rem;
}
.search_input.half,
.form_section .half{
	width: 50%;
}
.search_input.xhalf,
.form_section .xhalf{
	width: 40%;
}
.search_input.xxhalf,
.form_section .xxhalf{
	width: 30%;
}
.search_input.small,
.form_section .small{
	width: 25%;
}

.search_input.xsmall,
.form_section .xsmall{
	width: 15%;
}


.search_input.w50,
.form_section .w50{
	width: 50px;
}

.search_input.w100,
.form_section .w100{
	width: 100px;
}
.search_input.w150,
.form_section .w150{
	width: 150px;
}

.search_input.w200,
.form_section .w200{
	width: 200px;
}



.form_section .inline {
	display: inline;
}

.datetime,
.date_picker,
.time_picker {
	display: inline-flex;
	position: relative;
	width: 100%;
	align-items: center;
	cursor: pointer;
}

.datetime:after,
.date_picker:after,
.time_picker:after {
	content: "\f073";
	font-family: "Font Awesome 5 Free";
	margin-left:0.5em;
	font-size:2.4rem;
	color:#999;
}


.time_picker:after {
	content: "\f017";

}


/* -------------------------------------
      pagination
---------------------------------------- */

.pager ,
.pagination {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	height: 3rem;
}

.pager .allpage {
    padding: .5rem 2rem .5rem .75rem;
}

.pagination .page_link{
	position: relative;
    display: block;
    /* padding: .5rem .75rem;
    line-height: 1.25; */
    padding: .5rem .75rem;
    line-height: 1.25;
    border: 1px solid;
    background-color: #fff;
	border-color: #d8dbe0;
	margin-left: -1px;
}

.pagination li:first-child .page_link{
	border-radius : 0.5rem 0 0 0.5rem;
}
.pagination li:last-child .page_link{
	border-radius : 0 0.5rem  0.5rem 0;
}

.pagination .active .page_link {
	background : #2660AD;
	border :1px solid #2660AD;
	color : #fff;
	z-index: 10;
}

/*
agree */
.agree_icon {
	background : #2660AD;
	color : #fff;
	display: block;
	cursor: pointer;
	width: 3em;
	font-size:14px;
	text-align: center;
	border-radius: 4px;
	padding : 0.3em 0.5em 0.4em;

}

/* -------------------------------------
      disp
---------------------------------------- */

.star {
	cursor: pointer;
	text-align :center;
	width: 100%;
}

.star:before {
	content: "\f05e";
	font-family: "Font Awesome 5 Free";
	margin:auto;
	color : #d61b79;
	font-weight: 900;
	font-size : 2.0rem;
}

.star.disp:before {
	content: "\f14a";
	font-weight: 900;
	color : #19b153;
}


/* -------------------------------------
      order
---------------------------------------- */

.order {
	cursor: pointer;
	text-align :center;
	font-size : 2.0rem;
	display: inline-block;
}
.order_up {
	color : #1815c4;
}
.order_down {
	color : #f05f0b;
}


/* -------------------------------------
      detail
---------------------------------------- */
.detail_title {
	width: 80%	;
	margin : 2rem auto;
	font-size : 2.0rem;
	font-weight: 700;


}


.detail_block {
	width: 80%	;
	margin : auto;
}
.detail_block:not(:first-child) {
	margin-top : 4rem;
}


.detail_section{
	display: flex;
}
.detail_table {
	width: 80%	;
	margin : auto;
}

.detail_table th,
.detail_table td
{
	border-bottom : 1px solid #d7d7d7;
	padding : 0.8em;
}

.detail_table th {
	width:25%;
}

.detail_table thead th {
	font-size : 1.4rem;
}


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

.detail_list_table {
	width: 80%	;
	margin : auto;
}

.detail_table .clear {
	width: 3em;
}

.detail_table  .clear_btn,
.clear_btn {
	display: inline-block;
	font-size:3.2rem;
	cursor: pointer;
	color : #999;
}

.detail_table_col2 th{
	width: auto;
	vertical-align: middle;
}

.picture_section {
	padding : 1rem 1rem 1rem 2rem;
	text-align :center;
	width : 60%;
}
.picture_section img{
	max-width:100%;
}

.required:after {
	
	content: "必須";
	font-size: 1.1rem;
	display: inline-block;
	padding: 0.2em 0.5em 0.4em;
	color: #fff;
	background-color: #d44848;
	border-radius: 4px;
	margin-left: 1em;
}
.conditional_required:after {
	
	content: attr(data-icon)"必須";
	font-size: 1.1rem;
	display: inline-block;
	padding: 0.2em 0.5em 0.4em;
	color: #fff;
	background-color: #45df40;
	border-radius: 4px;
	margin-left: 1em;
}



.image_upload_block {
	display: block;
	border : 1px solid #d7d7d7;
	border-radius: 6px;
	padding : 6px;
	margin-bottom : 1.6rem;
	width: 100%;
}
.colum2 .image_upload_block {
	width: 49%;
}


.file_upload_block {
	display: block;
	border : 1px solid #d7d7d7;
	border-radius: 6px;
	padding : 6px;
	margin-bottom : 1.6rem;
	width: 100%;
}
.colum2 .file_upload_block {
	width: 49%;
}

.contents_flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.image_upload_output {
	cursor: pointer;
}

.accordion_hook {
	text-align :center;
	cursor: pointer;
	text-decoration: underline;
	margin-bottom : 1.6rem;
}



.schedule_delete {
	font-size : 2.4rem;
	cursor: pointer;
	margin : auto;
	text-align: center;
}
.add_schedule {
	width: 80%	;
	margin : 1.6rem auto;
	text-align : center;
	display: flex;
	justify-content: flex-end;
}

.add_schedule  .base_btn {
	margin-left : 1em;
}

input[type="text"].times {
	width: 320px;
}

.page_navi {
	display: flex;
	justify-content: flex-end;
}

.page_navi li{
	padding:0.2em 1em 0.2em 0;
	font-size:1.4rem;
}

.page_navi li.down:before{
	content:"\f107";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	padding-right:0.2em;
}
.page_navi li.up:before{
	content:"\f106";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	padding-right:0.2em;
}



.contents_select {
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding : 0 10%;
}
.contents_select a {
	display: block;
	margin : 8px 0;
	width : 40%;
	padding : 10px;
	text-align:center;
	border : 1px solid #ddd;
	border-radius: 6px;
	cursor: pointer;
}


.step_list_inner {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	position: relative;
	z-index: 1;
}

.step_list_inner:after {
	content:"";
	display: block;
	width: 80%;
	border-bottom : 2px solid #ccc;
	position: absolute;
	top : 1em;
	left : 50%;
	transform: translateX(-50%);
	z-index: 0;
}


.step_list_inner .__step {
	width: 100%;
	text-align: center;
	color : #999;
	z-index: 2;
}
.step_list_inner .__step:before {
	content : "";
	display: block;
	width : 2em;
	height:2em;
	background : #ccc;
	border-radius: 50%;
	margin:0 auto 1em;
}


.step_list_inner .__step.finished {
	color : #333;
}
.step_list_inner .__step.finished:before {
	background : #333;
}

.step_list_inner .__step.current {
	color : #e02e46;
}
.step_list_inner .__step.current:before {
	background : #e02e46;
}



/* -------------------------------------
     case 1023px               */
@media screen and (max-width: 1023px) {
		
	.detail_table {
		width: 30%	;
	}
	.detail_table.modal_table {
		width: 90%	;
	}
	.picture_section {
		width: 70%	;
	}

	.detail_table th,
	.detail_table td{
		display: block;
	}
}
/* -------------------------------------
     case 767px (== SP)               */
	 @media screen and (max-width: 767px) {
		
	.detail_section {
		flex-wrap: wrap;
	}
	.detail_table {
		width: 100%	;
	}
	.picture_section {
		width: 100%	;
	}

}