@charset "UTF-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900);
@import url('https://fonts.googleapis.com/css?family=Marcellus');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800');


body {
/* ★★★　背景白は解除background-color:#ffffff;★★★ */
	font-family:'Gill Sans', 'Gill Sans MT', 'Roboto', Arial, 'Noto Sans Japanese',"游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	color:#111;
    letter-spacing: 0.05em;
	font-size:16px;
	line-height:2em;
}
.clear{
	clear:both;
}
img{line-height:0; }
img[usemap] {
    max-width: 100%;
    height: auto;
}
a {outline:none;}
a img {outline:none;}
a:visited{outline:none;}
.cnkr_menu{}
.cnkr_menu a{
    color:#111 !important;
	font-family:sans-serif;
}
section a:hover {
	color:#000000;
	text-decoration:underline;
}


@media screen and (min-width: 0px) {
/* 共通用のスタイル記述 */
body {
/* ★★★　背景白は解除background-color:#ffffff;★★★ */
	font-family:'Gill Sans', 'Gill Sans MT', 'Roboto', Arial, 'Noto Sans Japanese',"游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	color:#111;
    letter-spacing: 0.05em;
	font-size:16px;
	line-height:2em;
}
.br-sp{
	display:none;
}
.for-pc{display: wodth:96%;margin:30px 2% 0;}
.for-pc img{width: 100%; height: auto;}
.for-sp{display: none;}

/* ★★★★★★★★★★　ヘッダー　★★★★★★★★★★ */

/* ★★★★★★★★★★　ページ用テンプレート　★★★★★★★★★★ */
#wrapper {
	width:100%;
/* max-width:1200px; */
	margin:76px auto 0px auto;
	padding:0px 0px 0px 0px ;
}

.mainvisual{
    width:1120px;
    margin:0 auto;
}
.mainvisual .pc{display: block;}
.mainvisual .sp{display: none;}

#about, #map, #contents, #news {
    width:1040px;
    margin:0px auto 60px;
    padding:0px 0px 100px 0px;
}

h2{
    margin:8px 0px 0px 0px;
    padding:98px 0px 8px 0px;
    font-size:42px;
    font-weight:700;
    text-align: center;
}
h2:after {
    content: "";
    display: block;
    width: 48px;
    height: 11px;
    margin: 12px auto 2px auto;
    background-color: #000;
}
.subtitle{
    font-size:11px;
    text-align: center;
    margin:0px 0px 32px 0px;
    padding: 0 0 0 0 ;
}
.subtitle:before {
    content: "";
    display: block;
    width: 48px;
    height: 11px;
    margin: 2px auto 9px auto;
    background-color: #000;
}


/* ★★★★★★★★★★　about　★★★★★★★★★★ */
#about{
    padding:0px 0px 48px 0px;
}

.about_box1{
    padding:10px 0 20px 0;
}
.about_box1{
    width:740px;
    margin:0 auto;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 0.1em;
    line-height: 2.2em;
    text-align: justify;
}



/* ★★★★★★★★★★　company　★★★★★★★★★★ */
.company_box{
    width:740px;
    margin:30px auto;
    letter-spacing: 0.05em;
}
.table_company{
    width:740px;
    border-bottom: solid 1px #111;
}
.table_company tr{
    border-top: solid 1px #111;
}
.table_company td{
    padding: 20px 0px 20px 10px;
}
.table_company td.left{width:140px;}
.table_company td.right{width:540px;}

.map{
    width:1020px; 
    margin:0 auto;
}
.map iframe{
    width:100%; 
    height: 360px;
    margin:0 auto;
}
.table_map{
    margin:10px 0 0 0;
    padding: 5px 0 0 0;
    border-top: solid 1px #ddd;
}
.table_map p{
    margin:0 0 0 0;
}
.table_map a{
    display: block;
    width: 180px;
    float: right;
    margin:0 0 0 0;
    padding: 5px;
    text-align: center;
    background-color: #ddd;
    border-radius: 3px;
}
.table_map a:hover{
    opacity: 0.5;
}

.caution_box{
    background-color: #eee;
    width:680px;
    margin:0px auto 150px;
    padding: 30px;
    letter-spacing: 0.05em;
    font-size:90%;
}

.caution_title{
    text-align: center;
    font-weight: bold;
}
.caution_list{
}
.caution_list li{
    list-style: disc;
    margin: 12px 0 0 10px;
    padding: 0 0 0 0px;
    line-height: 20px;
}


/* ★★★★★★★★★★　news　★★★★★★★★★★ */
.fr_sns {
    width: 440px;
    float: left;
    margin: 0px 10px 0px 10px;
}


/* ★★★★★★★★★★　gototop　★★★★★★★★★★ */
.gototop a{
    display: block;
    width:100%;
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 10px 0px;
    text-align: center;
    border-top: solid 1px #111;
    border-bottom: solid 1px #111;
    z-index: 99999;
	font-size:11px;
    line-height: 1.7em;
	color:#111;
}
.gototop a:hover{
    opacity: 0.5;
}

/* ★★★★★★★★★★　footer　★★★★★★★★★★ */
footer{
	margin:0px auto 0px auto;
	text-align:center;
	letter-spacing:0.1em;
	font-size:11px;
}
.footer_wrap{
	margin:110px auto 0px auto;

}
.footer_icon{
    width:240px;
    margin:0 auto 8px;
    text-align: center;
    bottom:24px;
    z-index: 9999;
}
.footer_icon a{
	margin:0px auto 0px auto;
}
.footer_icon a:hover{
	opacity: 0.7;
}
.footer_copyright{
    width:100%;
    text-align: center;
	margin:0px auto 40px auto;
}
/* ★★★★★★★★★★　SNS　★★★★★★★★★★ */
.snsgroup{
    position: fixed;
    top: 45%;
    right:20px;
}
.snsgroup ul{
}
.snsgroup ul li{
    margin:0px 0px 10px 0px ;
}


/* ★★★★★★★★★★　SNS　★★★★★★★★★★ */
.snsgroup_sp{
    float:right;
    margin: 9px 0 0 0 ;
}

.snsgroup_sp a{
    display: inline;
    margin:0px 10px 0px 10px ;
}
.snsgroup_pchead{
    float:right;
    margin: 4px 0 0 12px ;
}

.snsgroup_pchead a{
    display: inline;
    margin:0px 10px 0px 10px ;
}

/* ★★★★★★★★★★　SHOPS　★★★★★★★★★★ */
.shops_index{
    }
.shops_index li{
    float: left;
    width:23%;
    margin:0 1%;
    line-height: 1.5em;
}
.shops_index li a{
    display: block;
    background-color: #ddd;
    border-radius: 30px;
    text-align: center;
    padding: 18px 0px 14px;
}
.shops_index li a:hover{
    opacity: 0.7;
    background-color: #eee;
}
.icon_description{
    text-align: center;
    margin: 30px 0px -30px;
}
.icon_description li{
    display: inline-block;
    height:30px;
    margin: 0 10px;
    font-size:12px;
    line-height: 1.8em;
    padding:15px 0 0px 34px;
}
.icon_description li.icon0{
    background-image:url(../images/shop_icon_0_on.png);
    background-repeat: no-repeat;
    background-size:30px 30px;
    background-position: left center;
}
.icon_description li.icon1{
    background-image:url(../images/shop_icon_1_on.png);
    background-repeat: no-repeat;
    background-size:30px 30px;
    background-position: left center;
}
.icon_description li.icon2{
    background-image:url(../images/shop_icon_2_on.png);
    background-repeat: no-repeat;
    background-size:30px 30px;
    background-position: left center;
}
.icon_description li.icon3{
    background-image:url(../images/shop_icon_3_on.png);
    background-repeat: no-repeat;
    background-size:30px 30px;
    background-position: left center;
}
.icon_description li.icon4{
    background-image:url(../images/shop_icon_4_on.png);
    background-repeat: no-repeat;
    background-size:30px 30px;
    background-position: left center;
}


.shops_category{
    width: 98%;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin:40px 1% 15px 1%;
    padding: 10px 0 10px 0;
}
.fashion{background-color: #123abc ;color: #fff;}
.food{background-color: #abc123;color: #fff;}
.salon{background-color: #1f81ef;color: #fff;}
.other{background-color: #cc34d3;color: #fff;}
.fashion1{color: #ffffff;}/* #123abc */
.food1{color: #ffffff;}
.salon1{color: #ffffff;}
.other1{color: #ffffff;}

.shops_box{
    position: relative;
    width: 44%;
    background-color: #f3f3f3;
    float:left;
    margin:10px 1% 10px 1%;
    padding: 10px 2% 10px 2%;
}
#shops_fashion, #shops_food, #shops_salon, #shops_other{
    padding: 32px 0 0 0;
}
.shop_num{
    position: absolute;
    bottom: 2px;
    right: 10px;
    margin:0px 0 0 0;
    font-size: 32px;
    font-weight: 700;
}
.shop_title{
    font-weight: 700;
}
.shop_address{
    font-size:12px;
    line-height: 1.5em;
}
.shop_tel{
    font-size:12px;
    line-height: 1.5em;
}
.shop_icon{
    position: absolute;
    bottom: -5px;
    right: 10px;
}
.shop_icon ul li{
    display: inline;
}



/* ★★★★★★★★★★　CONTENTS　★★★★★★★★★★ */

.contents_index{}
.contents_index li{
    float: left;
    width:18%;
    margin:0 1%;
    line-height: 1.5em;
}
.contents_index li a{
    display: block;
    background-color: #ddd;
    border-radius: 52px;
    text-align: center;
    padding: 18px 0px 14px;
}
.contents_index li a:hover{
    opacity: 0.5;
    background-color: #eee;
}
.contents_index li a span{
    display:block;
    font-size:60%;
    margin-bottom:0px;
}

.contents_box{
    margin:10px 0 10px 0;
    padding: 40px 0 10px 0; 
    }
.contents_category{
    width: 98%;
    font-size: 21px;
    font-weight: bold;
    text-align: center;
    margin:40px 1% 15px 1%;
    padding: 15px 0 10px 0;
}
.contents_category span{
    display:block;
    font-size:60%;
    font-weight:normal;
    line-height:1.5;
}
.cc1_box{
    width: 46%;
    float: left;
    margin: 30px 2% 10px;
}
.cc1_box h3{
    font-size:18px;
    font-weight: 700;
}
.cc1_box img{
    width: 100%;
    height: auto;
}
.cc1_profile{
    width:75%;
    float:left;    
    font-size:75%;
    line-height: 1.5em;
    margin-bottom: 10px;
}
img.cc1_photo{
    width:22%;
    height: auto;
    float:right;
}

.cc1{background-color: #123abc ;color: #fff;}
.cc2{background-color: #abc123;color: #fff;}
.cc3{background-color: #1f81ef;color: #fff;}
.cc4{background-color: #cc34d3;color: #fff;}
.cc5{background-color: #cc34d3;color: #fff;}
.contents_2line{
    width:46%;
    margin:20px 2% 20px 2%;
    float: left;
}
.contents_2line_img img{
    width: 100%;
    height: auto;
}
.contents_3line{
    width:30.33333%;
    margin:20px 1.5% 20px 1.5%;
    float: left;
}
.contents_3line_img img{
    width: 100%;
    height: auto;
}
.contents_4line{
    width:21%;
    margin:20px 2% 20px 2%;
    float: left;
}
.contents_4line_img img{
    width: 100%;
    height: auto;
}
.line4_text{
    font-size: 80%;
    line-height: 1.5em;
}

.kyosan{
    width:740px;
    margin: 50px auto 0px;
}
.kyosan img{
    width: 100%;
    height: auto;
}

.inshoku_box_left{
    width:340px;
    float: left;
}
.inshoku_box_right{
    width:120px;
    float: right;    
}
.inshoku_box_right img{
    width: 100%;
    height: auto;
    margin-top: 20px;
}



}


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
ここから下、スマホ用
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */





@media screen and (max-width: 768px) {
/* スマホ用記述 */
body {
/* ★★★　背景白は解除background-color:#ffffff;★★★ */
	font-family:'Gill Sans', 'Gill Sans MT', 'Roboto', Arial, 'Noto Sans Japanese',"游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	color:#111;
    letter-spacing: 0.05em;
	font-size:14px;
	line-height:1.9em;
}
.br-pc{
	display:none;
}
.br-sp{
	display:block;
}
.for-pc{display: none;}
.for-sp{display: block; margin:30px 0 0 0;}
.for-sp img{width: 100%;height: auto;}
/* ★★★★★★★★★★　ヘッダー　★★★★★★★★★★ */

/* ★★★★★★★★★★　ページ用テンプレート　★★★★★★★★★★ */
#wrapper {
	width:100%;
	margin:56px auto 0px auto;
	padding:0px 0px 0px 0px ;
}
.mainvisual{
    width:100%;
    margin:0 auto;
}
.mainvisual img{
    width:100%;
    height:auto;
}
.mainvisual .pc{display: none;}
.mainvisual .sp{display: block;}

#about, #map, #contents, #news {
    width:90%;
    margin:0px 5%;
    padding:0px 0px 48px 0px;
}
h2{
    margin:8px 0px 0px 0px;
    padding:98px 0px 5px 0px;
    font-size:27px;
    font-weight:700;
    text-align: center;
}

h2:after {
    content: "";
    display: block;
    width: 32px;
    height: 7px;
    margin: 7px auto 0px auto;
    background-color: #000;
}

.subtitle{
    font-size:11px;
    text-align: center;
    margin:0px 0px 32px 0px;
}

.subtitle:before {
    content: "";
    display: block;
    width: 32px;
    height: 7px;
    margin: 2px auto 7px auto;
    background-color: #000;
}


/* ★★★★★★★★★★　about　★★★★★★★★★★ */
#about{
}

.about_box1{
    width:100%;
    margin:0 0%;
    font-size: 15px;
    letter-spacing: 0.1em;
    line-height: 2.2em;
    text-align: justify;
}


/* ★★★★★★★★★★　company　★★★★★★★★★★ */
.company_box{
    width:100%;
    margin:30px auto;
    letter-spacing: 0.05em;
    font-size: 13px;
    line-height: 2em;
}
.table_company{
    width:100%;
    border-bottom: solid 1px #111;
}
.table_company tr{
    border-top: solid 1px #111;
}
.table_company td{
    padding: 20px 2% 20px 1%;
}
.table_company td.left{width:16%;}
.table_company td.right{width:78%;}

.map{
    width:100%; 
    margin:0 auto;
}
.map iframe{
    width:100%; 
    height: 360px;
    margin:0 auto;
}

.table_map p{
    margin:0 0 0 0;
}
.table_map a{
    display: block;
    width: 100%;
    float: right;
    margin:0 0 0 0;
    padding: 5px 0;
    text-align: center;
    background-color: #ddd;
    border-radius: 3px;
}
.table_map a:hover{
    opacity: 0.5;
}


.caution_box{
    background-color: #eee;
    width:78%;
    margin:30px 6%;
    padding: 5%;
    letter-spacing: 0.05em;
    font-size:90%;
}

.caution_title{
    text-align: center;
    font-weight: bold;
}
.caution_list{
}
.caution_list li{
    list-style: disc;
    margin: 12px 0 0 10px;
    padding: 0 0 0 0px;
    line-height: 20px;
}


/* ★★★★★★★★★★　news　★★★★★★★★★★ */
.fr_sns {
    width: 90%;
    float: left;
    margin: 0px 5% 0px 5%;
}


/* ★★★★★★★★★★　footer　★★★★★★★★★★ */
footer{
	margin:0px auto 0px auto;
	text-align:center;
	letter-spacing:0.1em;
	font-size:9px;
}
.footer_wrap{
	margin:90px auto 0px auto;

}
.footer_icon{
    width:120px;
    margin:12px auto 12px;
    text-align: center;
    bottom:24px;
    z-index: 9999;
}
.footer_icon img{
    width:120px;
    height: auto;
}

.footer_icon a{
	margin:0px auto 0px auto;
}
.footer_icon a:hover{
	opacity: 0.7;
}
.footer_copyright{
    width:100%;
    text-align: center;
}


/* ★★★★★★★★★★　SNS　★★★★★★★★★★ */
.snsgroup_sp{
    margin: 0 0 0 0 ;
}

.snsgroup_sp a{
    display: inline;
    margin:0px 10px 0px 10px ;
}


/* ★★★★★★★★★★　SHOPS　★★★★★★★★★★ */
.shops_index{
    }
.shops_index li{
    float: left;
    width:46%;
    margin:8px 2%;
    line-height: 1.5em;
}
.shops_index li a{
    display: block;
    background-color: #ddd;
    border-radius: 30px;
    text-align: center;
    padding: 18px 0px 14px;
}
.shops_index li a:hover{
    opacity: 0.7;
    background-color: #eee;
}

.icon_description{
    text-align: left;
}
.icon_description li{
    display: inline-block;
    width:60%;
    height:30px;
    margin: 0 0 0 15%;
    font-size:12px;
    line-height: 1.8em;
    padding:15px 0 0px 34px;
}

.shops_category{
    width: 98%;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin:40px 1% 15px 1%;
    padding: 10px 0 10px 0;
}
.fashion{
    background-color: #123abc;
    color: #fff;
}
.food{
    background-color: #abc123;
    color: #fff;
}
.salon{
    background-color: #1f81ef;
    color: #fff;
}
.other{
    background-color: #cc34d3;
    color: #fff;
}
.shops_box{
    width: 90%;
    background-color: #f3f3f3;
    float:left;
    margin:6px 1% 6px 1%;
    padding: 10px 4% 10px 4%;
}
#shops_fashion, #shops_food, #shops_salon, #shops_other{
    padding: 32px 0 0 0;
}

.shop_title{}
.shop_address{}
.shop_tel{}
.shop_icon ul li img{
    width: 20px;
    height:auto;
}


/* ★★★★★★★★★★　CONTENTS　★★★★★★★★★★ */

.contents_index{}
.contents_index li{
    float: left;
    width:46%;
    margin:8px 2%;
    line-height: 1.5em;
}
.contents_index li a{
    display: block;
    background-color: #ddd;
    border-radius: 30px;
    text-align: center;
    padding: 18px 0px 14px;
}
.contents_index li a:hover{
    opacity: 0.5;
    background-color: #eee;
}
.contents_box{
    margin:10px 0 10px 0;
    padding: 40px 0 10px 0; 
    }
.contents_category{
    width: 98%;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin:40px 1% 15px 1%;
    padding: 10px 0 10px 0;
}

.cc1_box{
    width: 98%;
    float: left;
    margin: 30px 1% 10px;
}
.cc1_box h3{
    font-size:18px;
    font-weight: 700;
}
.cc1_box img{
    width: 100%;
    height: auto;
}
.cc1_profile{
    width:75%;
    float:left;    
    font-size:75%;
    line-height: 1.5em;
    margin-bottom: 10px;
}
img.cc1_photo{
    width:22%;
    height: auto;
    float:right;
}



.contents_2line{
    width:98%;
    margin:20px 1% 20px 1%;
    float: left;
}
.contents_2line_img img{
    width: 100%;
    height: auto;
}
.contents_3line{
    width:98%;
    margin:20px 1% 20px 1%;
    float: left;
}
.contents_3line_img img{
    width: 100%;
    height: auto;
}
.contents_4line{
    width:98%;
    margin:20px 1% 20px 1%;
    float: left;
}
.contents_4line_img img{
    width: 100%;
    height: auto;
}

.kyosan{
    width:100%;
    margin: 20px auto 0px;
}
.kyosan img{
    width: 100%;
    height: auto;
}
.inshoku_box_left{
    width:70%;
    float: left;
    margin: 2% 0 0 0;
}
.inshoku_box_right{
    width:27%;
    float: right;   
    margin: 2% 0 0 3%;
}
.inshoku_box_right img{
    width: 100%;
    height: auto;
    margin-top: 20px;
}

}