@charset "utf-8";
@import url('//fonts.googleapis.com/earlyaccess/notosansjapanese.css');
@font-face {
  font-family: 'Noto Serif Japanese';
  font-style: normal;
  font-weight: 200;
  src: url('./font/NotoSerifJP-ExtraLight.woff') format('woff');
}
@font-face {
  font-family: 'Noto Serif Japanese';
  font-style: bold;
  font-weight: 700;
  src: url('./font/NotoSerifJP-Bold.woff') format('woff');
}
@media only screen and (min-width: 768px) {
	#header .header_logo_area{
		padding: 0 10px;
	}
	#header .header_logo_area .header_logo a{
		padding: 0;
	}
}
.overlay {
    z-index: 1;
}
.drawer {
    top: 45px;
}
.theme_main_only .drawer {
        top: -25px;
}

/*--------------------------------------------ログイン前_スライド表示-------*/
.main_visual,
#contents .main_visual{
}
.main_visual .imgbox,
#contents .main_visual div.imgbox{
	display: block;
	position: relative;
	width:100%;
	height:500px;
	/*background-size: auto 100%;*/
	/*background-size: 100% auto;*/
	background-size: cover;
	background-position:right center;
	background-repeat: no-repeat;
	z-index:0;
}
.main_visual .imgbox.login,
#contents .main_visual div.imgbox.login{/*--ログイン後_ロゴのみ--*/
	height:320px;
	}
.main_visual .imgbox div.txtbox,
#contents .main_visual div.imgbox div.txtbox{
	z-index:1;
	position: absolute;
	background:rgba(255,255,255,1.0);
	padding:10px;
}
.main_visual .imgbox div.txtbox.txtbox1,
#contents .main_visual div.imgbox div.txtbox.txtbox1{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	align-content: center;
	top:0;
	left:0;
	width:40%;
	height:100%;
	max-width:330px;
}
.main_visual .imgbox div.txtbox.txtbox1 div,
#contents .main_visual div.imgbox div.txtbox.txtbox1 div{
	width:100%;
	display: block;
}
.main_visual .imgbox div.txtbox.txtbox1 div.tate,
#contents .main_visual div.imgbox div.txtbox.txtbox1 div.tate{
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	align-items: stretch;
}
.main_visual .imgbox div.txtbox.txtbox1 div.tate p,
.main_visual .imgbox div.txtbox.txtbox1 div.tate h2,
#contents .main_visual div.imgbox div.txtbox.txtbox1 div.tate p,
#contents .main_visual div.imgbox div.txtbox.txtbox1 div.tate h2{
        writing-mode: vertical-rl;
	letter-spacing: 1px;
}
.main_visual .imgbox div.txtbox img.logo,
#contents .main_visual div.imgbox div.txtbox img.logo{
	display: block;
	width:100%;
	max-width:240px;
	height:auto;
	margin:0 0 15px;
}
.main_visual .imgbox div.txtbox h2,
.main_visual .imgbox div.txtbox p,
#contents .main_visual div.imgbox div.txtbox h2,
#contents .main_visual div.imgbox div.txtbox p{
	margin:0;
}
.main_visual .imgbox div.txtbox h2,
#contents .main_visual div.imgbox div.txtbox h2{
	margin:0 0 10px;
}
.main_visual .imgbox div.txtbox h2 span,
.main_visual .imgbox div.txtbox p span,
#contents .main_visual div.imgbox div.txtbox h2 span,
#contents .main_visual div.imgbox div.txtbox p span{
	display: inline-block;
}
.main_visual .imgbox div.txtbox h2 span.color,
#contents .main_visual div.imgbox div.txtbox h2 span.color{
	color:#ff880d;
}
@media only screen and (min-width: 900px) {
.main_visual .imgbox.login,
#contents .main_visual div.imgbox.login{/*--ログイン後_ロゴのみ--*/
	background-size: 75% auto;
	}
}
@media only screen and (min-width: 768px) {
.main_visual .imgbox.login,
#contents .main_visual div.imgbox.login{/*--ログイン後_ロゴのみ--*/
	height:420px;
	}
}
@media only screen and (max-width: 768px) {
.main_visual .imgbox,
#contents .main_visual div.imgbox{
	height:350px;
	}
.main_visual .imgbox div.txtbox.txtbox1,
#contents .main_visual div.imgbox div.txtbox.txtbox1{
	width:40%;
	max-width:200px;
	}
.main_visual .imgbox div.txtbox p,
#contents .main_visual div.imgbox div.txtbox p{
	font-size:small;
	}
.main_visual .imgbox div.txtbox h2,
#contents .main_visual div.imgbox div.txtbox h2{
	margin:0 0 10px;
	}
.main_visual .imgbox div.txtbox.txtbox1 div.tate p,
.main_visual .imgbox div.txtbox.txtbox1 div.tate h2,
#contents .main_visual div.imgbox div.txtbox.txtbox1 div.tate p,
#contents .main_visual div.imgbox div.txtbox.txtbox1 div.tate h2{
        writing-mode: vertical-rl;
	letter-spacing: 0;
	}
}
@media only screen and (max-width: 700px) {
.main_visual .imgbox,
#contents .main_visual div.imgbox{
	/*background-position:left 25vw center;*/
	}
}
@media only screen and (max-width: 480px) {
.main_visual .imgbox,
#contents .main_visual div.imgbox{
	/*background-position:left 15vw center;*/
	}
}
@media only screen and (max-width: 400px) {
.main_visual .imgbox,
#contents .main_visual div.imgbox{
	/*background-position:left 10vw center;*/
	}
}

/*--------------------------------------------ログイン前_オンラインショップリンク-------*/
#header .header_bottom_area {
	position: relative;
}
#header .header_bottom_area .guide.pc{
	z-index:1;
}
 div.onlineshop{
	z-index:0;
	position: relative;
	width:100%;
	max-width: 1080px;
	margin:0 auto;
}
div.onlineshop a{
	position: absolute;
	top:-50px;
	right:0;
    display: block;
	width:190px;
    height: 50px;
    /*background-color: #333e58;*/
background-color:#ff880d;
	font-size:90%;
    color: #fff;
    padding: 0 1em 0 45px;
    background-image: url(./icon_cartw.png);
    background-size: 31px 28px;
    background-position: left 10px center;
    background-repeat: no-repeat;
    display:flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	align-content: center; 
}
@media only screen and (max-width: 768px) {
div.onlineshop a{
	top:-45px;
	height: 45px;
	}
}
@media only screen and (max-width: 600px) {
div.onlineshop a{
	width: 50px;
    padding: 0;
	}
div.onlineshop a span{
	display:none;
	}
}
/*-------------------------------ログイン前_オンラインショップリンク_SPメニュー内------*/
.spbox2 .online_sp{
	color:#fff;
	background-color: #ff880d;
	padding:10px;
}
.spbox2 .online_sp img{
	display:inline-block;
	width:31px;
	height:auto;
	margin:0 5px 0 0;
}
.spbox2 .online_sp + p{
}
.spbox2 .online_sp + p a{
	border-top: 0px;
	padding:10px;
}
.spbox2 .online_sp + p a ~ a{
	border-left: 1px solid #DCDCDC;
}
/*-------------------------------ログイン前indexリンク------*/
.flex_list_link{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
	align-content: stretch;
	width:100%;
	max-width:1080px;
	margin:0 auto 60px;
}
.flex_list_link div,
.flex_list_link a{
	display:block;
	width:24.2%;
	height:100px;
	padding:0 0.5em;
	margin:0;
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	text-align:center;
	/*border:1px solid #333e58;
	color: #333e58;*/
	/*color:#fff;
	background-color:#333e58;*/
	/*color:#282828;
	background-color:#efefef;*/
	color:#fff;
	background-color:#ff880d;
}
.flex_list_link a:hover,
.flex_list_link a:focus,
.flex_list_link a:active{
	opacity:0.7;
}
@media only screen and (min-width: 768px) {
.flex_list_link div:not(:first-child),
.flex_list_link a:not(:first-child){
	/*margin:0 0 0 1%;*/
	}
.flex_list_link{
	justify-content: space-between;
	}
}
@media only screen and (max-width: 768px) {
.flex_list_p{
	margin:0 auto 30px;
	}
.flex_list_link div,
.flex_list_link a{
	width:49%;
	}
.flex_list_link div:nth-child(odd),
.flex_list_link a:nth-child(odd){
	margin:0 0 5px 0;
	}
.flex_list_link div:nth-child(even),
.flex_list_link a:nth-child(even){
	margin:0 0 5px 1%;
	}
}
@media only screen and (max-width: 480px) {
.flex_list_link div,
.flex_list_link a{
	height:60px;
	width:100%;
	margin:0 0 5px;
	}
.flex_list_link div:nth-child(odd),
.flex_list_link a:nth-child(odd),
.flex_list_link div:nth-child(even),
.flex_list_link a:nth-child(even){
	margin:0 0 5px;
	}
}
/*-------------------------------企業情報リンク1PC左-------*/
#mypgnav.compnav ul li a.current{
    background-color: #F5F7F8;
}
/*-------------------------------企業情報リンク２-------*/
.conplink2{
}
.conplink2 ul{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.conplink2 ul li{
    display: block;
    width: 50%;
    width: -webkit-calc(100% / 2);
    width: calc(100% / 2);
    border-bottom: 1px solid #DCDCDC;
    border-right: 1px solid #DCDCDC;
}
.conplink2 ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background-color: #F5F7F8;
    text-align: center;
    padding: 20px 0;
    font-size: 90%;
}
.conplink2 ul li a.current {
    background-color: #747C8D;
    color: #fff;
}
@media only screen and (max-width: 480px) {
.conplink2 ul li a {
	font-size: small;
	}
}
/*-------------------------------追加ページ：制服のお手入れ-------*/
.care_flex{
    display:flex;
    flex-direction: column;
}
.care_flex .care_menu{
    flex-shrink: 0;
    flex-grow: 0;
    width:100%;
    margin:0 0 30px 0;
}
.care_flex .care_menu a{
    display:block;
    font-size:small;
    padding:5px 0;
}
.care_flex .care_menu a + a{
    margin:0.5em 0 0;
}
.care_flex .care_menu a span{
    display:inline-block;
}
.care_flex .care_menu a span:first-child{
    background-color: #ff8400;
    color:#fff;
    padding:0 5px;
	margin:0 5px 0 0;
}
.care_flex .comuni{
    flex-shrink: 2;
    flex-grow: 2;
}
.care_flex .lesson{
    margin:0 0 50px;
}
.care_flex .lesson .subbox{
    display:flex;
    flex-direction: column;
}
.care_flex .lesson .subbox.rev{
    flex-direction: column-reverse;
}
.care_flex .lesson .subbox + .subbox{
    margin:1em 0 0;
}
.care_flex .lesson .subbox .imgbox{
    display:block;
    flex-shrink: 0;
    flex-grow: 0;
    width:100%;
    height:auto;
	padding:5px 0 0;
}
.care_flex .lesson .subbox .txtbox2 img,
.care_flex .lesson .subbox .imgbox img{
    display:block;
    margin:auto;
    width:auto;
}
.care_flex .lesson .subbox .txtbox2,
.care_flex .lesson .subbox .txtbox{
    flex-shrink: 2;
    flex-grow: 2;
    width:100%;
    font-size:small;
}
.care_flex .lesson .subbox .txtbox2 h3,
.care_flex .lesson .subbox .txtbox h3{
    font-size:medium;
    color: #ff8400;
}
.care_flex .lesson .subbox .txtbox2 h3.margin_t0,
.care_flex .lesson .subbox .txtbox h3.margin_t0{
    margin-top:0;
}
.care_flex .lesson .subbox ol{
  counter-reset: my-counter;
  list-style: none;
  padding: 0;
  margin: 0;
}
.care_flex .lesson .subbox ul li,
.care_flex .lesson .subbox ol li{/*--リスト項目--*/
    position: relative;
    z-index:1;
    padding:0 0 0 1.2em;
}
.care_flex .lesson .subbox ul li{
    padding:0 0 0 1em;
}
.care_flex .lesson .subbox ol li{
    padding:0 0 0 1.2em;
}
.care_flex .lesson .subbox ul li + li,
.care_flex .lesson .subbox ol li + li{
    margin:0.5em 0 0 0;
}
.care_flex .lesson .subbox ul li:before,
.care_flex .lesson .subbox ol li:before{
    position: absolute;
    left: 0;
    z-index:2;
}
.care_flex .lesson .subbox ol li:before{
    top: 0.2em;
  content: counter(my-counter);
  counter-increment: my-counter;
  text-align:center;
    background-color: #282828;
  color:#fff;
  line-height:1.1em;
    width:1.1em;
    height:1.1em;
    border-radius: 1em;
}
.care_flex .lesson .subbox ul li:before{
    top: 0.4em;
    content:"";
    width:0.7em;
    height:0.7em;
    background-color: #282828;
    transform: rotate(45deg);
}
.care_flex .lesson_title{/*--lesson見出し--*/
    display:flex;
    flex-direction: row;
    align-items: center; 
    padding:0 0 20px;
}
.care_flex .lesson_title p.number{
    flex-shrink: 0;
    flex-grow: 0;
    text-align: center;
    font-size:small;
    letter-spacing: 2px;
    background-color: #ff8400;
    color:#fff;
    width:64px;
    margin:0;
    padding:0 5px;
    position:relative;
}
.care_flex .lesson_title p.number::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 32px solid transparent;
  border-left: 32px solid transparent;
  border-top: 20px solid #ff8400;
  border-bottom: 0;
    
}
.care_flex .lesson_title p.number span{
    display:block;
    font-size:x-large;
}
.care_flex .lesson_title div.subtitle{
    flex-shrink: 2;
    flex-grow: 2;
    margin:0 0 0 10px;
}
.care_flex .lesson_title h2{
    font-size:large;
    margin:0;
}
.care_flex .lesson_title h2 span{
    display:inline-block;
}
.care_flex .lesson_title p{
    font-size:small;
    margin:0;
}
.care_flex .lesson p.point{
    display:block;
    border: 1px solid #FF3300;
    font-size:small;
}
.care_flex .lesson p.point span{
    display:block;
    box-sizing: border-box;
    padding:5px;
}
.care_flex .lesson p.point span:first-child{
    background-color: #FFCC99;
    text-align:center;
}
@media only screen and (min-width: 480px) {
.care_flex .care_menu a{
    font-size:medium;
    }
.care_flex .lesson_title p.number{
    width:72px;
    font-size:medium;
    }
.care_flex .lesson_title p.number::after{
  border-right: 36px solid transparent;
  border-left: 36px solid transparent;
    }
.care_flex .lesson_title p.number span{
    font-size:xx-large;
    }
}
@media only screen and (min-width: 768px) {
.care_flex .lesson_title h2{
    font-size:x-large;
    }
.care_flex .lesson_title p{
    font-size:medium;
    }
.care_flex .lesson .subbox.rev,
.care_flex .lesson .subbox{
    flex-direction: row; 
}
.care_flex .lesson .subbox .imgbox{
	padding:0 0 0 5px;
	}
.care_flex .lesson .subbox.rev .imgbox{
	padding:0 5px 0 0;
	}
.care_flex .lesson .subbox .imgbox{
    width:20%;
}
.care_flex .lesson .subbox .txtbox{
    width:80%;
    }
.care_flex .lesson .subbox .txtbox2 h3,
.care_flex .lesson .subbox .txtbox h3{
    font-size:large;
}
.care_flex .lesson p.point,
.care_flex .lesson .subbox .txtbox2,
.care_flex .lesson .subbox .txtbox{
    font-size:medium;
    }
}
@media only screen and (min-width: 1010px) {
.care_flex{
    flex-direction: row;
    }
.care_flex .care_menu{
    width:200px;
    margin:60px 30px 0 0;
    }
.care_flex .care_menu div{
    position:sticky;
    top: 0;
    }
.care_flex .care_menu a span:first-child{
    display:block;
	margin:0;
    }
.care_flex .care_menu a + a{
    margin:1em 0 0;
	}
}
/*-------------------------------ヘッダー_リンク表示修正１-------*/
#header .guide.pc{
	/*background-color:#efefef;*/
	background-color:#282828;
}
#header .guide_link li .headmenu_box label,
#header .guide_link li > a.guide_home,
#header .guide_link li > a {
	/*border-bottom: 2px solid #efefef;*/
	border-bottom: 2px solid #282828;
	color:#fff;
}
#header .itemall.nikk .nikk_link ul li a,
#header .guide_link ul.catelist2 li a {
	color: #282828;
}
#header .guide_link li .headmenu_box .headmenu_show .guide_js a{
	border-bottom: 2px solid #fff;
}
#header .guide_link li > a.guide_home span {
    /*background-image: url(../img/unishop/icon_homew.png);*/
	background-image: url(./icon_homew.png);
}
#header .guide_link li > a.current {
    background-color: #ff880d;
    border-bottom: 2px solid #ff880d;
}

#header .guide_link li > a.guide_home:hover,
#header .guide_link li > a.guide_home:focus,
#header .guide_link li > a.guide_home:active,
#header .guide_link li > a:hover,
#header .guide_link li > a:focus,
#header .guide_link li > a:active {
	border-bottom: 2px solid #cf1426;
	color:#fff;
}
#header .guide_link li > a.guide_home span {
	border-right: 0px;
}
#header .guide_link li:not(first-child) > a span,
#header .guide_link li:nth-child(2) > a span {
	/*border-left: 1px dotted #707070;*/
	border-left: 0px;
}
.cb.cb-search{
    fill: #fff;
}
@media only screen and (min-width: 768px) {
    #header .header_bottom_area {
        border-top: 0px;
        border-bottom: 0px;
    }
}
/*-------------------------------ログイン後TOPスライド_一般-------*/
.main_visual .schoolon.item_toraya01 .item01,
.main_visual .schoolon.item_toraya01 .item02,
.main_visual .schoolon.item_toraya01 .item03,
.main_visual .schoolon.item_toraya01 .item04,
.main_visual .schoolon.item_toraya01 .item05,
.main_visual .schoolon.item_toraya01 .item06{
	position:absolute;
	width:auto;
	height:100%;
	top:0;
}
.main_visual .schoolon.item_toraya01 .item01{
	right:70%;
}
.main_visual .schoolon.item_toraya01 .item02{
	right:60%;
}
.main_visual .schoolon.item_toraya01 .item03{
	right:50%;
}
.main_visual .schoolon.item_toraya01 .item04{
	left:70%;
}
.main_visual .schoolon.item_toraya01 .item05{
	left:50%;
}
.main_visual .schoolon.item_toraya01 .item06{
	left:55%;
}
@media only screen and (max-width: 768px) {
.main_visual .schoolon.item_toraya01 .item01{
	right:60%;
}
.main_visual .schoolon.item_toraya01 .item02{
	right:50%;
}
.main_visual .schoolon.item_toraya01 .item03{
	right:40%;
}
.main_visual .schoolon.item_toraya01 .item04{
	left:65%;
}
.main_visual .schoolon.item_toraya01 .item05{
	left:40%;
	}
.main_visual .schoolon.item_toraya01 .item06{
	left:45%;
	}
}
@media only screen and (max-width: 480px) {
.main_visual .schoolon.item_toraya01 .item01{
	right:50%;
}
.main_visual .schoolon.item_toraya01 .item02{
	right:40%;
}
.main_visual .schoolon.item_toraya01 .item03{
	right:30%;
}
.main_visual .schoolon.item_toraya01 .item04{
	left:65%;
}
.main_visual .schoolon.item_toraya01 .item05{
	left:35%;
	}
.main_visual .schoolon.item_toraya01 .item06{
	left:40%;
	}
}
/*-------------------------------ログイン後TOP_スライド下アイテム一覧等の順番を変更-------*/
#main_bottom .indexcat:first-child{
	border-top: 0px;
        margin: 0 auto 30px;
        padding: 0;
}
@media only screen and (min-width: 768px) {
	#main_bottom .indexcat:first-child{
        	margin: 0 auto 60px;
        	padding: 0;
	}
}
/*-------------------------------ログイン後TOP_スライド下カテゴリーの文字サイズを変更-------*/
.indexcat .catelist2 a, .block_category .catlist a {
	font-size:120%;
}
@media only screen and (min-width: 910px) {
	.indexcat .catelist2 li, 
	.block_category .catlist a,
	.indexcat .catelist2 li ul.child_categories li, 
	.indexcat .catelist2 li.top_category a {
		width: 24%;
	}
}
@media only screen and (min-width: 768px) {
	.indexcat .catelist2 a, .block_category .catlist a {
		font-size:150%;
	}
}