/*--------------------------

AIA Co., Ltd. 

data:2019/8/9   
                         
--------------------------*/

@charset "utf-8";

/*--------------------------
  アニメーション
--------------------------*/
/*　下に下がる動き　*/
@keyframes DownAnime{
  from {
  	opacity: 1;
	transform: translateY(0);
  }
  to {
  	opacity: 1;
	transform: translateY(100px);
  }
}
/*　上に上がる動き　*/
@keyframes UpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }
  to {
    opacity: 1;
	transform: translateY(0);
  }
}

/*--------------------------
  body 
---------------------------*/
body{
	margin:0;
	padding:0;
	font-family:'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3',Meiryo, メイリオ, sans-serif,'Lucida Grande';
	-webkit-print-color-adjust: exact;
}

a{
	text-decoration:none;
}

/*--------------------------
  見出し 
  font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
--------------------------*/
.categry {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    height: auto;
    position: relative;
	color:#FFF;
}

.categry div {
    background: rgba(138,21,60,0.3);
}

.product .categry {
    background-image: url(../../images/categry/product.jpg);
}

.concept .categry {
    background-image: url(../../images/categry/concept.jpg);
}

.about .categry {
    background-image: url(../../images/categry/about.jpg);
}

.meeting .categry,
.met_check .categry,
.met_mail_ok .categry {
    background-image: url(../../images/categry/meeting.jpg);
}

.contact .categry,
.check .categry,
.mail_ok .categry {
    background-image: url(../../images/categry/contact.jpg);
}

.other .categry{
    background-image: url(../../images/categry/other.jpg);
}

.update .categry{
    background-image: url(../../images/categry/update.jpg);
}

/*--------------------------
  フォント
--------------------------*/
h1,
h2,
h3,
h4,
h5{
    font-family: "Noto Serif JP", serif;
}

h1,
h3{
	text-align: center;
    color: #8A153C;
}

h2{
	text-align: center;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.product h4 {
	text-align: center;
	color:#FFF;
}

.product h4 {
    letter-spacing: 5px;
    border-radius: 100px;
    padding-left: 4px;
}

.seasonal h4 span {
    border-radius: 100px;
}

.spring h4,
.seasonal h4 span:nth-child(1){
	background:#FFBFFF;
}

.summer h4,
.seasonal h4 span:nth-child(2){
	background:#008C00;
}

.autumn h4,
.seasonal h4 span:nth-child(3){
	background:#663300;
}

.winter h4,
.seasonal h4 span:nth-child(4){
	background:#006DD9;
	
}

.seasonal h4 {
    display: flex;
    justify-content: center;
}

.other h4{
    border-bottom: #8A153C solid 3px;
}

.other h4:first-letter{
  color: #8A153C;
}

.local_sentence h5,
.p_name{
    text-align: center;
}

.feel .sentence{
	font-family: "Noto Serif JP", serif;
    text-align: center;
}

.modaal_table .restriction,
.modaal_table thead th,
.p_name,
.local_images span{
        font-family: "Noto Serif JP", serif;
}

.fc-red,
.modaal_table .restriction{
	color:#F00;
	font-weight:600;
}

.fc-redb{
	font-weight:bold;
	color:#F00;
}

.text_vertical{
	 writing-mode: vertical-rl;
	 -ms-writing-mode: tb-rl;
}


/*--------------------------
  フレーム
--------------------------*/
.com_flex{
	display:flex;
}

.block{
	display:block;
}

.mb4{
    margin-bottom:4em !important;
}

/* -------------------------
  リストスタイル
-------------------------- */
/*ヘッダー*/
.header_button {
    list-style: none;
}

/*フッター*/
.footer_menu ul{
    list-style: none;
}

/*パンくずリスト*/
.breadcrumbs ul{
	list-style:none;
}

/*トップ*/
.top_pinfo li {
    list-style: none;
}

/*商品紹介*/
.product section ul{
	list-style:none;
}

.modaal_table tbody .size2 ul{
	list-style:none;
}

/*こだわり*/
.local ul,
.succession ul{
	list-style:none;
}

/*作り手の紹介*/
.virus ul li {
    list-style: none;
}

/*オンライン商談*/
.advantage ul{
	list-style:none;
}

/* 入力フォーム*/
.process {
    list-style: none;
}

.check_button{
    list-style: none;
}

/*--------------------------
  画像
--------------------------*/
.modaal-wrapper img{
	width:100%;
}

.product img,
.concept img,
.about img{
	width:100%;
}

/*--------------------------
  ボタン
--------------------------*/
.down_button{
	background: #8a153c;
	border:#FFF 3px solid;
    color: #FFF;
    font-weight: 700;
    border-radius: 30px;
	text-align:center
}

.down_button:hover{
	background: #FFF;
	border:#8a153c 3px solid;
    color: #8a153c;
}

/*--------------------------
  モーダルウィンドウ
--------------------------*/
.close{
	display:none;
}

/*モーダルの横幅を変更したい場合*/
.modaal-container{
    max-width: 1000px;
}

/*モーダルのボタンの色を変更したい場合*/
.modaal-close:after, 
.modaal-close:before{
	background:#ccc;	
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}

/*--------------------------
  ヘッダー
--------------------------*/
.header_button a {
    color: #8A153C;
}

/* -------------------------
  パンくずリスト
-------------------------- */
.breadcrumbs{
	margin:0;
	padding:0;
	background:#FFF;
}

.breadcrumbs ul{
	margin:0 auto;
	padding:1em 0;
	width: 100%;
    text-align: left;
}

.breadcrumbs li{
	margin:0;
	padding:0;
	display:inline-block;
}

.breadcrumbs li:after{
	content:">";
	font-weight:500;
	color:#000;
	padding: 0 0.5em;
}

.breadcrumbs li:last-child:after{
	content:"" !important;
	margin: 0 -0.8em 0 0;
}

.breadcrumbs a{
	color:#000;
	margin:0;
	border-radius:30px;
	width:100%;	
	padding: 0.1em 0.5em;
}

.breadcrumbs li:last-child{
	color: #8A153C;
}

.breadcrumbs a:hover{
	background: #8A153C;
    color: #FFF;
}

.breadcrumbs span{
	margin:0 0.5em 0 0;
}

/*--------------------------
  フッター 
--------------------------*/
#footer_info{
	margin:0;
	padding:0;
}

.footer_cont{
	background: rgba(138,21,60,0.6);
	color:#FFF;
}

.footer_cont table tfoot .mail a:hover,
.fcont_right a:hover {
	background:#FFF;
	color:#8A153C;
}

.footer_menu a:hover {
	color:#FFF;
	background:#8A153C;
}

.sns a:after {
    display: block;
    content: '\f16d';
    font-family: "Font Awesome 5 Brands";
    color: #FFF;
}

/*コピーライト*/
.copyright{
	margin:0;
	padding:0;	
	text-align:center;
	background:#8A153C;
	color:#FFF;
}

.copyright .last{
	padding:0.8em 0;
}

.sns img{
	max-width:30px;
	vertical-align: middle;
}

/* -------------------------
  戻るボタン
-------------------------- */
/*リンクの形状*/
#page_top a{
	display: flex;
	justify-content:center;
	align-items:center;
	background:#FFF;
    border:solid 3px #8A153C;
	border-radius: 5px;
	color: #fff;
	text-align: center;
	text-transform: uppercase; 
	text-decoration: none;
	font-size:0.6rem;
	transition:all 0.3s;
	position: relative;
}

#page_top a:before{
  font-family:"Font Awesome 5 Free";
  font-weight: 900;
  content:'\f062';
  font-size: 25px;
  color: #8A153C;
  position:absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin:auto;
  text-align:center;
}

#page_top a:hover{
	background: #8A153C;
	color: #FFF;
	border:solid 3px #FFF;
}

#page_top a:hover:before{
	color: #FFF;
}

/*リンクを右下に固定*/
#page_top {
	position: fixed;
	right: 10px;
	bottom:40px;
	z-index: 2;
    /*はじめは非表示*/
	opacity: 0;
	transform: translateY(100px);
}
/*　上に上がる動き　*/
#page_top.UpMove{
	animation: UpAnime 0.5s forwards;
}
/*　下に下がる動き　*/
#page_top.DownMove{
	animation: DownAnime 0.5s forwards;
}

/* -------------------------
  スライダー
-------------------------- */
.test_top_slider {
	position:relative;
	overflow:hidden;
}

.test_slider {
    margin:0 auto;
}

/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.slick-prev, 
.slick-next {
    position: absolute;/*絶対配置にする*/
    top: 42%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #666;/*矢印の色*/
    border-right: 2px solid #666;/*矢印の色*/
    height: 15px;
    width: 15px;
}

.slick-prev {
    transform: rotate(-135deg);
}

.slick-next {
    transform: rotate(45deg);
}


/* -------------------------
  トップ
-------------------------- */
/*  商品紹介  */
.top_pinfo ul {	
    flex-wrap: wrap;
	text-align: center;
}

.top_pinfo li {
    display: flex;
}

.top_pinfo img {
    width: 100%;
	vertical-align: top;
}

.top_pinfo a {
    display: block;
    height: 100%;
    width: 100%;
}

.top_pinfo p {
    color: #8A153C;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
	background-image: url(../../images/index/pinfo_00.jpg);
}

/*  お知らせ  */
/*.news_info div{
	width:95%;
}*/

.newyear{
	text-align:center;
}

/* -------------------------
  商品紹介
-------------------------- */
.product section ul {
    flex-wrap: wrap;
    justify-content: space-between;
}

.modaal_table thead th {
    text-align: center;
    letter-spacing: 1px;
}


.modaal_table .title{
	font-weight:600;
	margin:0.8em 0 0 0;
}

/* -------------------------
  こだわり
-------------------------- */
.local div{
	text-align:center;
}

.local_sentence,
.succession ul{
	flex-wrap: wrap;
    justify-content: space-between;
}

.local_images li:nth-child(1),
.local_images li:nth-child(3){
	width:30%;
}

.local_images li:nth-child(2){
	width:40%;
}

.local_images li{
	position: relative;
}

.local_sentence li{
	width:calc(100%/3.2);
}

.local_images span{
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -40%);
    height: 100%;
}

@media all and (-ms-high-contrast: none) {
.local_images span{
	position: absolute;
    top: 20%;
    left: 40%;
    transform: translate(0, -20%);
    height: 100%;
}
}

/* -------------------------
  作り手の紹介
-------------------------- */
.about a{
	color:#000;
}

.virus ul {
    flex-wrap: wrap;
	justify-content: space-between;
	width:100%;
}

.virus ul li {
    width: calc(100% / 2.2);
    padding: 0.3em;
}

.virus ol {
	width:85%;
}

/* -------------------------
  商談
-------------------------- */
.sample_video video,
.advantage img{
    width: 100%;
    margin: auto;
}

.sample_video p{
	    text-align: right;
}

.online p{
    line-height: 130%;
}

.sample_video p,
.advantage p{
	margin: 0.5em 0 0 0;
}

.advantage ul {
    flex-wrap: wrap;
	justify-content: space-between;
	width:100%;
}

.advantage li{
	width:calc(100% / 3.2);
}

/* -------------------------
  入力フォーム
-------------------------- */
/*案内　必要事項　内容の確認　送信完了*/

.check_form table p{
	color:#F00;
}

.process {
    font-weight: 600;
    letter-spacing: 1px;
    justify-content: space-between;
}

.process li:after {
    content: ">";
}

.process li:last-child::after {
    display: none;
}

.disp {
    color: #8A153C;
    border-radius: 30px;
	padding: 0 10px;
}

/*入力フォーム*/
.contact_form table,
.check_form table{
    width: 100%;
}

.check_form table th,
.check_form table td,
.contact_form table th,
.contact_form table td{
    border-bottom: 1px solid #CCC;
}

.check_form table tr:first-child th,
.check_form table tr:first-child td,
.contact_form table tr:first-child th,
.contact_form table tr:first-child td{
    border-top: 1px solid #CCC;
}

.contact_form table tr:last-child th,
.contact_form table tr:last-child td{
    border-bottom: none;
}

.contact_form table th,
.check_form table th{
    vertical-align: top;
    text-align: left;
    text-align-last: justify;
}

.form{
    border: 1px solid #ccc;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: rgb(255 255 255 / 40%) 0 1px 0, inset rgb(0 0 0 / 70%) 0 1px 1px;
    -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(000,000,000,0.7) 0 1px 1px;
    box-shadow: rgb(255 255 255 / 40%) 0 1px 0, inset rgb(0 0 0 / 70%) 0 1px 1px;
    padding: 5px;
    margin: 0px 0px 5px 0px;
}

.text,
.textarea {
    width: 95%;
}

.texts {
    width: 100px;
}

.choice{
   width:auto;
}

.check_form ul {
    justify-content: center;
    flex-wrap: wrap;
}

.contact_button,
.check_form ul input,
.comp_button a{
    background:#8A153C;
    color:#FFF;
}

.contact_button{
    padding: 8px 30px;
}

.comp_button {
    text-align: center;
}

.comp_button a {
    padding: 0.8em 1em;  
}

.contact_button:hover,
.check_form ul input:hover,
.comp_button a:hover{
    background:#FFF;
    color:#8A153C;
}

/* エラー */
.error{
	height:100vh;
	position:relative;
}

.error > div{
	position:absolute;
	top:30%;
	left:50%;
	transform:translate(-50%,-30%);
}

.error p {
    text-align: center;
}

.error .error_messege{
	margin:0 auto 30px auto;
}

.error .back-button{
	padding:8px 30px !important;
	border: 3px solid #FFF;
	border-radius: 30px;
	background: #8A153C;
    color: #FFF;
}

.error .back-button:hover{
	border: 3px solid #8A153C;
	background: #FFF;
    color: #8A153C;
}

/* -------------------------
  サイトポリシー
  プライバシーポリシー
-------------------------- */
.other .sentence ul {
    margin: 0.4em 0 0 auto;
}

.other table{
	width:100%;
}

.other table td{
	padding: 0.5em 0;
}

/* -------------------------
   過去の更新情報
-------------------------- */
/*アコーディオン全体*/
.accordion-area{
    list-style: none;
    margin:0 auto;
}

.accordion-area li{
    margin: 10px 0;
}

.accordion-area section {
	border: 1px solid #ccc;
}

/*アコーディオンタイトル*/
.years {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-weight: normal;
    transition: all .5s ease;
}

/*アイコンの＋と×*/
.years::before,
.years::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
    
}
.years::before{
    top:48%;
    left: 15px;
    transform: rotate(0deg);
    
}
.years::after{    
    top:48%;
    left: 15px;
    transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
.years.pclose::before{
	transform: rotate(45deg);
}

.years.pclose::after{
	transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.box {
    display: none;/*はじめは非表示*/
	margin:0 5% 3% 5%;
}

/* -------------------------
  印刷用
-------------------------- */
@media print{
.frame_1200{
	width:95%;
}

.header .frame_1200
.footer_cont .frame_1200{
	margin: auto;
}

/*   header
-------------------------- */
.header .logo{
	width:40%;
}

.header_nav {
    width: 60%;
}

.header_button{
	width:100%;
}

.header_button li{
	box-sizing:border-box;
	width:25%;
}

/*   footer
-------------------------- */
.footer_menu a {
	font-size: 13px;
}

.fcont_right .tel {
	font-size: 13px !important;
}



/* スペース
-------------------------- */  
.product section,
.concept section,
.about section,
.meeting section,
.other {
    margin-bottom: 5em !important;
}

.sentence p, .sentence li,
.concept
.local_sentence p {
    line-height: 120%!important;
}

/* トップ
-------------------------- */  
.feel h1 {
   font-size: 35px;
}

.feel .sentence p{
   font-size: 18px !important;
　 letter-spacing: 0;
}

.news_info dl {
    min-height: 200px !important;
}

/* こだわり
-------------------------- */ 
.local_images li:nth-child(1),
.local_images li:nth-child(3) {
    font-size: 35px !important;
}

.local div img {
    max-width: 150px !important;
}

/* 作り手の紹介
-------------------------- */ 
.owner .pc_f50p:nth-child(1){
	width:40% !important;
}

.owner .pc_f50p:nth-child(2){
	width:60% !important;
}

.owner p {
    padding: 0 0 5px 0 !important;
	line-height: 140%;
}

.about table th,
.about table td {
    padding: 10px 0 !important;
}

.virus ol li {
    padding: 0 0 0.5em 0 !important;
}

}