@charset "utf-8";

/*
************************************************************************
* コンテンツエディタ
************************************************************************
*/
.contents-editor-wraper
{
    display: flex;
    flex-wrap:wrap;
    border-top:1px solid #CCCCCC;
    padding:1em 0;
}
.contents-editor-wraper > .contents-editor-title
{
    padding: 0.25em 0.5em;
    border-left: 2px solid #3287a8;
    font-weight:bold;
}
.contents-editor-wraper > .contents-editor-header
{
    flex:0 0 100%;
    display: flex;

    padding: 0.5em 0;
    border-bottom:1px dashed #DDDDDD;
}
.contents-editor-wraper > .contents-editor-header > .title
{
    flex:1 0 auto;
    padding:0.25em 0.25em 0.25em 0.0em;
}
.contents-editor-wraper > .contents-editor-header > .sort
{
    flex:0 1 auto;
    padding:0.25em;
}
.contents-editor-wraper > .contents-editor-header > .remove
{
    flex:0 1 auto;
    padding:0.25em;
}
.contents-editor-wraper > .contents-editor
{
    flex:0 0 100%;
    padding: 1.0em 0;
}

.add-section
{
    padding-top: 1em;
    border-top: 1px solid #CCCCCC;
}

.editor-contents-tile
{
    display: flex;
    flex-wrap: wrap;

    margin:-0.5em;
}
.editor-contents-tile > .editor-contents-tile-item
{
    margin:0.5em;
    flex:0 0 calc(25% - 1em);
}
.editor-contents-tile > .editor-contents-tile-item.editor-contents-tile-item-add
{
    border-radius: 0.5em;
    background-color:#EFEFEF;
    cursor:pointer;

    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    
}

/* コンテンツエディタ用のフォーム */
input.contents-editor-input,
textarea.contents-editor-input,
div.contents-editor-input
{
	display:block;
	margin-bottom:0.25em;
	
	width:calc(100% - 0.0em);
	border-radius: 0.4em;
	border:0px solid transparent;
	background-color:#EFEFEF;
	padding:0.5em;
	line-height:1.5;
	font-size: 1.4rem;

	height:auto;
}
div.contents-editor-input.label
{
	background-color:#FFFFFF;
}

input.contents-editor-input.no-margin,
textarea.contents-editor-input.no-margin,
div.contents-editor-input.no-margin
{
	margin-bottom:0.0em;
}
textarea.contents-editor-input
{
	min-height:4.0em;
}
div.contents-editor-input
{
    min-height:2.5em;
}
div.contents-editor-input.large
{
    min-height:4.5em;
}

input.contents-editor-input.error,
textarea.contents-editor-input.error
{
	background-color:#FFCCCC;
}
.contents-editor-input-button > div
{
    position:absolute;
    bottom:0.25em;
    right:0.25em;
}

/* ################################################################################################ */
/* ## TAB                        ################################################################## */
/* ################################################################################################ */
@media screen and (max-width:1200px) {
}

/* ################################################################################################ */
/* ## スマホサイト用スタイル ###################################################################### */
/* ################################################################################################ */
@media screen and (max-width:640px) {
}